Jqueryリアルタイム傍受input valueの例
実例は以下の通りです
1)現在のオブジェクトの属性が変更され、キーボードまたはマウスのイベントによって励起されます。
2)現在のオブジェクトはフォーカスを失う。
onpropertychange
現在のオブジェクト属性が変更されると、イベントが発生しますが、それはIEだけのものです。
oninputはonpropertychangeの非IEバージョンで、firefoxとoperaなどのブラウザをサポートします。
しかし、これはオブジェクトに結合されている場合、オブジェクトのすべての属性変更がイベントをトリガするわけではなく、オブジェクトのvalue値が変更されたときにのみ有効になります。
ここでは私たちはinput valueの変更をモニターするのにもってこいです。
以上のJqueryはリアルタイムでinput valueを監督しています。その例は小編集が皆さんに提供した内容の全部です。参考にしていただければと思います。よろしくお願いします。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body id="lia-body">
<div class="lia-content">
<div class="inputwrapper">
<label><span> :</span><input type="text" name="fullname"></label>
<div class="result"></div>
</div>
</div>
<script src="http://apps.bdimg.com/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(function(){
var $inputwrapper = $('#lia-body .lia-content .inputwrapper');
$inputwrapper.find('input').on('input propertychange',function(){
var result = $(this).val();
console.log(result);
$inputwrapper.find('.result').html(result);
});
})
</script>
</body>
</html>
onchangeトリガイベントは二つの条件を満たす必要があります。1)現在のオブジェクトの属性が変更され、キーボードまたはマウスのイベントによって励起されます。
2)現在のオブジェクトはフォーカスを失う。
onpropertychange
現在のオブジェクト属性が変更されると、イベントが発生しますが、それはIEだけのものです。
oninputはonpropertychangeの非IEバージョンで、firefoxとoperaなどのブラウザをサポートします。
しかし、これはオブジェクトに結合されている場合、オブジェクトのすべての属性変更がイベントをトリガするわけではなく、オブジェクトのvalue値が変更されたときにのみ有効になります。
ここでは私たちはinput valueの変更をモニターするのにもってこいです。
以上のJqueryはリアルタイムでinput valueを監督しています。その例は小編集が皆さんに提供した内容の全部です。参考にしていただければと思います。よろしくお願いします。