stopPropagation 不适用于 IE 中的 select2 选项

Question

我正在尝试在 select2 选项列表中添加 link。我想绑定一个事件。它在 chrome 和 firefox 中运行良好。但它在 IE(9/10/11) 中不起作用。我尝试了所有替代方案，cancelbubble，returnValue 但是 none 正在工作。

当我用 class categoryDelete 单击 hyperlink 时，它会将事件传播到 li 选项，甚至不在 IE 中执行我的自定义 mouseup 事件。

我也在堆栈溢出中尝试了 this answer。我使用 templateResult 将 link 添加到 select2 选项。在上面的 link 中，他们使用了 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");
});

stopPropagation 不适用于 IE 中的 select2 选项

stopPropagation is not working for select2 options in IE

jquery

jquery-select2