Question

我正在附加一个ul列表并且它的工作正常，除非我尝试附加我的ul表时我指定了一个挂接到事件监听器的start-dropdownClose类：

$(".start-dropdownClose").click(function(event){
    event.stopPropagation();
    $thisOne = $($(this).parent().attr('id'));
    alert($thisOne.selector);
    $("#" + $thisOne.selector).fadeOut();
});

继承我的附加方法：

IfpClientGui.prototype.updateFloors = function(floors){
    // updates floor list from master list of floors. 

    var ifpcg = this;
    var ifpc = ifpcg.getIfpClient();
    $("#floor_list").empty();
    $("#floor_list").append("<li class='start-dropdownClose'><a href='' onclick='return false;'>X</a></li>");

    for(var i = 0; i < floors.length; i++)
    {

        $link = $('<a href="javascript:void(0);">'+floors[i].ifpf_name+'</a>');
        $link.data("floor",floors[i]);
        $link.click(function(){         
            ifpcg.hideAllOptionBoxes();

            ifpc.displayFloor($(this).data("floor"));
            $(this).parent().find("#ifpOptionList").show();
        });

        var $floor = $('<li></li>');
        $floor.append($link);
        ifpcg.updateOptions(floors[i].groups,$floor);
        $("#floor_list").append($floor);

    }

}

关于为什么会发生这种情况的任何想法或建议？

事件监听位于init的{{1}}级别内。我甚至尝试将外面的事件转移到ifpClientGui，但没有成功。

Answer 1

$(".start-dropdownClose")仅适用于执行此代码时存在的该类的元素。稍后在此类中添加元素时，它们将不会绑定到事件处理程序。

试试这个：

$('#floor_list').on("click", ".start-dropdownClose"), function(event){
  // Your code ...
});

这意味着监听器在#floor_list上（我假设它始终存在）。将注册元素上发生的任何点击，如果它发生在特定类上，则触发该功能。

Answer 2

您最有可能错误地附加了事件侦听器。请记住，对于动态添加的元素，您必须使用事件委派：

$("#floor_list").on(event_name, '.start-dropdownClose', fn);

附加ul - JQuery

2 个答案: