☰

すべての変更を検出（すぐに）JQueryを使用して質問する

tag-icon • tag-icon javascript jquery html
すべての変更を検出（すぐに）JQueryを使用して質問する

の値が変化する方法は多数あり<input type="text">、たとえば次のようになります。

  • キー押下
  • コピーペースト
  • JavaScriptで変更
  • ブラウザまたはツールバーによる自動補完
  • フォームのリセット

JavaScript 関数は、変更されるたびに (現在の入力値を使用して) 呼び出されるようにします。また、入力がフォーカスを失ったときだけでなく、すぐに呼び出されるようにします。

私は、これをすべてのブラウザで実行するための最もクリーンかつ堅牢な方法 (できれば jQuery を使用) を探しています。

ベストアンサー1

この jQuery コードは、.bind()任意の要素への即時の変更をキャッチするために使用され、すべてのブラウザーで動作するはずです。

 $('.myElements').each(function() {
   var elem = $(this);

   // Save current value of element
   elem.data('oldVal', elem.val());

   // Look for changes in the value
   elem.bind("propertychange change click keyup input paste", function(event){
      // If value has changed...
      if (elem.data('oldVal') != elem.val()) {
       // Updated stored value
       elem.data('oldVal', elem.val());
    
       // Do action
       ....
     }
   });
 });

ただし、.bind()jQuery バージョン 3.0 では非推奨になっていることに注意してください。jQuery バージョン 1.7 以降を使用している場合は、.on()代わりに を使用する必要があります。

おすすめ記事