使用关闭按钮扩展jQuery UI Accordion - 绑定事件处理程序

Question

我试图在某些菜单标题上使用关闭按钮扩展jQuery UI Accordion小部件，如下所示：

我已经使用font-awesome图标添加了关闭按钮，因此HTML看起来大致如下：

<div id="main-menu" data-menucloser="urltohandlecleanup">
    <div>
        <div class="clear-fix">
            <div style="float: left;">System Management</div>
            <div style="float: right;">&nbsp;</div>
        </div>
    </div>
    <div><ul>
        <li><a href="url">Sub Menu Item 1</a></li>
        <li><a href="url">Sub Menu Item 2</a></li>
    </ul></div>
    <div>
        <div class="clear-fix">
            <div style="float: left;">My Tenant</div>
            <div style="float: right;">&nbsp;</div>
        </div>
    </div>
    <div><ul>
        <li><a href="url">Sub Menu Item 1</a></li>
        <li><a href="url">Sub Menu Item 2</a></li>
    </ul></div>
    <div>
        <div class="clear-fix">
            <div style="float: left;">Green Account</div>
            <div style="float: right;"><i class="fa fa-times-circle menu-closer" data-close="thing to close"></i></div>
        </div>
    </div>
    <div><ul>
        <li><a href="url">Sub Menu Item 1</a></li>
        <li><a href="url">Sub Menu Item 2</a></li>
    </ul></div>
</div>

我已经设置了我的jQuery，将click事件附加到关闭按钮，如下所示：

$(function() {
    $("#main-menu").on("click", ".ui-accordion .menu-closer", function() {

        var url = $("#main-menu").attr("data-menucloser");
        var payload = $.param({ close: $(this).attr("data-close") });
        var itemToClose = $(this).closest(".ui-accordion-header");
        $.ajax({
            url: url,
            type: "POST",
            data: payload,
            contentType: "application/x-www-form-urlencoded; charset=UTF-8",
            dataType: "json"

        }).done(function(data) {
            if (data.result == "done") {
                itemToClose.next().remove();
                itemToClose.remove();

            }
        });
    });
});

但是，我的点击事件处理程序并没有被点击。我猜测是因为它被一个小部件本身覆盖了一个preventDefault（）...所以如何将一个事件处理程序附加到我的图标？

Answer 1

选中JSFIDDLE。

this should Help.