javascript - jQuery 看不到我动态加载的复选框

Question

我编写了一个脚本，可以将一系列产品加载到一个 div 标签中。

我现在希望能够使用一系列复选框来过滤这些产品。

jquery 将 $post 发送到返回 XML 数据集的 ASP 页面。数据集的第一个元素包含制造商列表，格式为 ara|dai|sid|alp 等。第二个元素包含上述代码的制造商名称。

然后我使用此脚本将复选框列表构建到 div 标记中。

var mc = new Array();
mc = $("manCodes",xml).text().split(",");
var manTitles = new Array();
manTitles = $("manTitles",xml).text().split(",");

for ( var i=0, len=mc.length; i<len; ++i ){
    m += '<span><input type="checkbox" value="' + mc[i] + '" name="man[]" id="man_'+i+'" />' + manTitles[i] +'</span>'//mc[i];
    }
manufacturers = '<div id="filter" class="man">FILTER<br />' + m + '</div>';
$(".formSelect").append(manufacturers);

这很有用，然后在“文档就绪”部分我有一个代码段，用于查找对复选框的任何点击:

$(document).ready( function() { 
     $("input:checkbox").click(function() {
    loadXML($("#sortOrder option:selected").val(),$("#limitBy option:selected").val(),$("#productGroup").val());
     });
});

这是我的代码失败的地方，因为任何复选框上的任何点击都不起作用。这几乎就像 JQuery 看不到它创建的这些复选框一样。

谁能帮忙解决这个问题？

干杯 格雷厄姆

Answer 1

您需要事件委托(delegate)，否则事件处理程序不会为动态插入/删除的元素触发。 .live或 .delegate有两个选项。

$("input:checkbox").live("click", function() {
    // implementation
});

或更好:

$("form").delegate("input:checkbox", "click", function() {
    // implementation
});