ajax応答要素のJQueryイベントをトリガーする

Question

私のcodeigniterプロジェクトでイベントトリガーに問題があります。私は自分のページにテーブルを動的にロードしたい。このテーブルは、私のコントローラからajax呼び出しによって返されます。そして、私はそのテーブルのスパンでクリックイベントを引き起こしたいと思います。私はこれをさまざまな方法で試しましたが、うまくいきませんでした。私はここに私のコードを添付しています。解決策を見つけるのを手伝ってください。

コントローラ：ビューで

$str = '<table> 
     <tr> 
      <td class="cost date" id="date_'.$request['SupplyID'].'"> 
       <span class="editable" style="display: none;"> 
        <input type="text" class="expiry" autocomplete="off" data-date-id="date_'.$request['SMSSupplyID'].'">          
       </span> 
       <span class="cnt" style="display: inline;">Choose</span> 
      </td> 
      </tr> 
     </table>'; 
echo $str; 

スクリプト：

function loadmore() 
    { 
     var url; 

     url = '/SMS/SMS/loadMoreRequests'; 

     $.ajax({ 
      type: 'post', 
      url: url, 
      data: { 
       limit:val 
      }, 
      success: function (response) { console.log(response); 

       $("#requestListTable").html(response); 
       val +=10; 
      } 
     }); 
    } 

$('.date').find('.cnt').on('click', function(){ 
    console.log(1);  // for testing 
}); 

Iは、次の変更、ない使用

1）

$('.date').find('.cnt').live('click', function(){ 
    console.log(1);  // for testing 
}); 

2）

0を試し

$('.date').find('.cnt').click(function(){ 
    console.log(1);  // for testing 
}); 

Answer 1

を試すことができます。あなたはこのためにイベントの委任を使用することができます

$(document).on('click','.cnt',function(){ 
    alert("Processing comes here"); 
}); 

Answer 2

あなたが動的に作成された要素にイベントを委任する必要があり、この

$(document).find(".cnt").on("click",function(){ 
    console.log(1);  // for testing 
}); 

Answer 3

$("container for the table").on("click", ".cnt", function() { 


}); 

。ドキュメント上のdom上に存在する親要素にイベントをバインドします。または単に使用することができます

$("body").on("click", ".cnt", function() { 


});