我有一个 ajax 调用，它使用以下代码为响应中的每条记录添加一些行到数据表中：
strAppName = data.Application_Name
maintCost = '<input class="maintCostField" appid="' + data.Application_ID + '" type="text" placeholder="$">';
$('#myReport').dataTable().fnAddData([
strAppName,
maintCost,
etc,
etc
]);
我尝试了以下选择器/事件来捕获对文本框的更改，但它们都没有触发。它们在 document.ready 部分...
$(".maintCostField").bind('change',function () {
val = $(this).val();
app = $(this).attr('appid');
alert('Updating app# ' + app + ' with ' + val);
});
$(".maintCostField").on('change',function () {
val = $(this).val();
app = $(this).attr('appid');
alert('Updating app# ' + app + ' with ' + val);
});
（我知道这个已弃用）
$(".maintCostField").live('change',function () {
val = $(this).val();
app = $(this).attr('appid');
alert('Updating app# ' + app + ' with ' + val);
});
我究竟做错了什么？我不明白为什么它与Click 事件对动态生成的元素或许多其他元素不起作用有什么不同......
更新* 我在数据表的 fnDrawCallback 事件中添加了以下内容，现在它可以工作了，只是它执行的次数与屏幕上的表单一样多。
$(".maintCostField").each(function () {
this.addEventListener("change", function () {
val = $(this).val();
app = $(this).attr('appid');
alert('Updating app# ' + app + ' with ' + val);
}, true);
});