ホームページ >ウェブフロントエンド >jsチュートリアル >JS判定テキストボックス内容変更の簡単な例event_javascriptスキル
JS判定テキストボックス内容変更の簡単な例event_javascriptスキル
- WBOYオリジナル
- 2016-05-16 16:56:291362ブラウズ
oninput、onpropertychange、onchange の使用法
onchange トリガー イベントは 2 つの条件を満たす必要があります:
a) 現在のオブジェクトのプロパティが変更され、キーボードまたはマウス イベントによってトリガーされます (スクリプト トリガーは無効です)
b) 現在のオブジェクトはフォーカスを失います (onblur)。
onpropertychange では、現在のオブジェクトのプロパティが変更される限り、イベントがトリガーされますが、これは IE に限定されます。
oninput は、onpropertychange の非 IE ブラウザ バージョンです。Firefox や Opera などのブラウザをサポートしますが、オブジェクトにバインドされている場合、オブジェクトのすべてのプロパティ変更だけでイベントをトリガーできるわけではありません。オブジェクトの値が変更されると機能します。
バブルイベントを停止
if (e) //イベントバブリングを停止 e.stopPropagation();else window.event.cancelBubble = true;
2 番目に、この機能を発見したので、問題が発生します。入力ボックスの値が変更されたときに関数操作を実行したい場合、カスタム属性も変更する必要があるため、onpropertychange が 2 回トリガーされることがあります。 、それは私たちが望んでいることではないかもしれません。
推測ですが、このような属性が提供されているので、どの属性が変更されたのかを取得できるはずです。パラメータの数とその内容を取得してみます。
XML/HTML コード
コードをコピー コードは次のとおりです:
それを実行すると、多くの属性がありますが、注意深く見てみると、propertyname という属性が見つかるかもしれません。この属性の意味は誰でも推測できると思います。はい、これはどの属性が変更されたかを取得するために使用されます。
XML/HTML コード
コードをコピー
コードは次のとおりです:
テキスト ボックスをクリックして値をそれぞれ入力すると、myprop と value がそれぞれポップアップ表示されます。
最初の問題に戻ると、値が変更されたかどうかを判断するだけで済みます。
コードを直接見てみましょう:
テキスト ボックスをクリックして値をそれぞれ入力すると、myprop と value がそれぞれポップアップ表示されます。
最初の問題に戻ると、値が変更されたかどうかを判断するだけで済みます。
コードを直接見てみましょう:
XML/HTML コード
コードをコピー