jQuery .on（ 'change'、function（）{}が動的に作成された入力に対してトリガーされない

問題は、動的に作成された入力タグのセットがいくつかあり、入力値が変更されるたびにトリガーされるようになっている関数もあることです。

$('input').on('change', function() {
  // Does some stuff and logs the event to the console
});

ただし、.on('change')は動的に作成された入力に対してはトリガーされず、ページがロードされたときに存在していたアイテムに対してのみトリガーされます。残念ながら、バインドのビットで、この葉に私は次のように.onのための代替であることを意味する.live()と.delegate()のラッパーであるすべては.bind()：/

他に誰かがこの問題を抱えているか、解決策を知っていますか？

on関数へのセレクターを提供する必要があります。

$(document).on('change', 'input', function() {
  // Does some stuff and logs the event to the console
});

その場合、期待どおりに動作します。また、ドキュメントの代わりにいくつかの要素を指定することをお勧めします。

理解を深めるには、この記事をお読みください：http : //elijahmanor.com/differences-between-jquery-bind-vs-live-vs-delegate-vs-on/

これを使って

$('body').on('change', '#id', function() {
  // Action goes here.
});

次のいずれかのアプローチを適用できます。

$("#Input_Id").change(function(){   // 1st
    // do your code here
    // When your element is already rendered
});


$("#Input_Id").on('change', function(){    // 2nd (A)
    // do your code here
    // It will specifically called on change of your element
});

$("body").on('change', '#Input_Id', function(){    // 2nd (B)
    // do your code here
    // It will filter the element "Input_Id" from the "body" and apply "onChange effect" on it
});

$("#id").change(function(){
    //does some stuff;
});

潜在的な混乱を明確にするためだけに。これは、要素がDOMロードに存在する場合にのみ機能します。

$("#target").change(function(){
    //does some stuff;
});

後で要素が動的に読み込まれると、以下を使用できます。

$(".parent-element").on('change', '#target', function(){
   //does some stuff;
});

$(document).on('change', '#id', aFunc);

function aFunc() {
  // code here...
}

要素がユーザー入力を受け取ったときに発生する「input」イベントを使用できます。

$(document).on('input', '#input_id', function() {
  // this will fire all possible change actions
});

w3のドキュメント

あなたは使うことができます：

$('body').ready(function(){
   $(document).on('change', '#elemID', function(){
      // do something
   });
});

それは私と一緒に動作します。