ホームページ > 記事 > ウェブフロントエンド > jqueryイベントchange()の使い方の詳しい説明
jqueryイベントchange()の使い方の詳しい説明
- 黄舟オリジナル
- 2018-05-15 10:12:389856ブラウズ
この記事は、jqueryのchange()の使い方を主に紹介しており、changeの機能、定義、具体的な使用スキルを分析しています。必要な方は参考にしてください。 jquery の変更と () の使用例。皆さんの参考に共有してください。具体的な解析は以下の通りです:
change() 要素の値が変更されると、changeイベントが発生します。このイベントは、テキスト フィールド、テキストエリア、および選択要素にのみ適用されます。
select 要素とともに使用すると、オプションが選択されたときに変更イベントが発生します。テキスト フィールドまたはテキスト領域で使用した場合、要素がフォーカスを失ったときにこのイベントが発生します。
1.changeの使い方
1.トリガー変更イベント:選択した要素の変更イベントをトリガー
2.変更イベントに
関数をバインド:実行する関数選択した要素の変更イベントが発生したとき。
構文: $(selector).change(function)
2. jquery のchange() インスタンス<html>
<head>
<script type="text/javascript" src="jquery文件"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".field").change(function(){
$(this).css("background-color","#FFFFCC");
});
$("button").click(function(){
$("input").change();
});
});
</script>
</head>
<body>
<button>激活文本域的 change 事件</button>
<p>Enter your name: <input class="field" type="text" /></p>
</body>
</html><html>
<head>
<script type="text/javascript" src="jquery文件"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".field").change(function(){
$(this).css("background-color","#FFFFCC");
});
});
</script>
</head>
<body>
<p>在某个域被使用或改变时，它会改变颜色。</p>
Enter your name: <input class="field" type="text" />
<p>Car:
<select class="field" name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
</p>
</body>
</html>oninput, onpropertychange,onchange use
l onchange トリガー イベントは、次の 2 つの条件を満たす必要があります。 a）現在のオブジェクトの変化と、キーボードまたはマウスのイベントによってトリガーされます（スクリプトのトリガーは無効です） onpropertychange の非 IE ブラウザ バージョン。Firefox や Opera などのブラウザをサポートします。ただし、オブジェクトにバインドされている場合、オブジェクトのすべてのプロパティが変更されるわけではなく、それが機能するだけです。オブジェクトの値が変化したとき。
テキストエリアでユーザーのキーボード入力をキャプチャしたい場合は、onkeyup を使用してイベントを確認するだけです。ただし、onkeyup はコピーと貼り付けをサポートしていないため、テキストエリア内の値の変更を動的に監視する必要があります。 onpropertychange (IE ブラウジングで使用されるブラウザ) と oninput (非 IE ブラウザ) は一緒に使用されます。
onpropertychange のバグ
コードの実装中に、テキストエリアの入力ボックスのフォント スタイルを変更するために obj.className="XX" が使用されている場合、テキストエリアのクリック時にユーザーに応答するときに入力が発生することが判明しました。 IE では最初の文字に対して onpropertychange がトリガーされないというバグがあるため、次のように設定する必要があります: obj.style.color="#000";
jQuery ライブラリを使用する場合、まず jquery について話しましょう。 、oninput と onpropertychange を同時にバインドするだけで問題ありません。サンプルコード:
$('#username').bind('input propertychange', function() {
$('#content').html($(this).val().length + ' characters');});以上がjqueryイベントchange()の使い方の詳しい説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。