如何使用jQuery动态过滤添加的一些内容

Question

首先，对不起我的英语，我还在学习：）。

我的问题是，接下来，我用jQuery添加了一些常见的HTML内容，特别是这些inputs:

<td id="date"><input type="text" id="input_1" class="select" /></td>
<td id="date"><input type="text" id="input_2" class="select" /></td>
<td id="date"><input type="text" id="input_3" class="select" /></td>
<td id="date"><input type="text" id="input_4" class="select" /></td>
<td id="date"><input type="text" id="input_X" class="select" /></td>

输入的数量取决于我在数据库中有多少寄存器。

另一方面，我在jQuery中有这段代码，我将其用于相同的内容，但它不是动态添加的。我尝试在添加以上内容后执行此脚本：

$('input')
    .filter(function() {
    return this.id.match(/input_./);
})
.foo({
    ....
});

当我尝试将相同的脚本应用于动态内容时，它不起作用，它与任何内容都不匹配。

我读过关于delegate()和live()方法的文章，但我不明白如何在我的情况下使用它们，因为我看到的所有示例都是针对处理程序事件的。

任何人都知道我该怎么解决这个问题。

提前谢谢。

Answer 1

$(document).on('change', 'input[id^=input_]', function() {
    /* Do stuff */
});

所以你可以做这样的演示

// Wrap inside a document ready
// Read .on() docs (To ensure the elements...bla bla)
$(document).ready( function () {
    input_index = 0;
    setInterval(addInput, 1000);
    $(document).on('change', 'input[id^=input_]', function() {
        $(this).val($(this).attr('id'));
    });
    function addInput () { 
        $('<input type="text" id="input_'+input_index+'"/>')
          .appendTo('#empty')
          .change();   // <============================ Pay attention to this
        input_index++;
    }
});