Question

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

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

jquery向返回XML数据集的ASP页面发布$ post。数据集的第一个元素包含这种格式的制造商列表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

您需要事件委派，否则不会为动态插入/删除的元素触发事件处理程序。 .live或.delegate是两种选择。

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

或更好：

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

Answer 2

使用jQuery.live()从动态添加的元素中捕获事件。

为所有人附加一个处理程序与当前相匹配的元素选择器，现在和将来。

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

Answer 3

尝试：

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

jQuery没有看到我动态加载的复选框

3 个答案: