Question

我正在尝试在select2选项列表中添加一个链接。我想绑定一个事件。它在chrome和firefox中运行良好。但它不适用于IE（9/10/11）。我尝试了所有替代品，cancelbubble，returnValue但没有一个正在工作。

当我点击带有类categoryDelete的超链接时，它正在将事件传播到li选项，甚至没有在IE中执行我的自定义鼠标事件。

我还在堆栈溢出中尝试了this answer。我使用templateResult添加了select2选项的链接。如上所述，他们使用formatResult。这有什么不同吗？

这是我的代码。

    $("#ContentPlaceHolder1_tags").select2({
            dropdownParent: "#dropdownParent",
            placeholder: "Select category",
            templateResult: function (item) { return '<a href="javascript:;" class="categoryDelete"></a>' + item.text },
            escapeMarkup: function(m) { return m },
            allowClear: true,
            tags: true,
            closeOnSelect: false
        });


    // adding event for link inside select2 options li
    $(".categoryDelete").mouseup(function (event) {
            event = event || window.event;
            event.preventDefault();
            event.stopPropagation();
            alert("clicked delete link");

    });

Answer 1

您的.categoryDelete是动态生成的，并且有不同的方式将事件添加到动态生成的元素，如下所示：

$(document).on('mouseup','.categoryDelete',function (event) {
        event = event || window.event;
        event.preventDefault();
        event.stopPropagation();
        alert("clicked delete link");
});

对于IE中的select2选项，stopPropagation不起作用

1 个答案: