jQuery ajax中 使用append()方法添加的元素事件无效

$(function () {
    var obj = null;
    $.ajax({
        url: "/navbor/navbor",
        type: "get",
        data: obj,
        dataType: "json",
        success: function (data) {
            var html = "";
            console.log("data:", data);
            var menusList = data.data.menusList;
            for (var i = 0; i < menusList.length; i++) {
                var menu = menusList[i].menuList;
                var title = "";
                if (menu != null && menu.length > 0) {
                    title = "<li class=\"treeview\"><a class=\"app-menu__item\" href=\"#\" data-toggle=\"treeview\"><i class=\"app-menu__icon fa fa-book\"></i><span class=\"app-menu__label\">" + menusList[i].menuName + "</span><i class=\"treeview-indicator fa fa-angle-right\"></i></a>"
                } else {
                    title = "<li><a class=\"app-menu__item\" href=\"#\"><i class=\"app-menu__icon fa fa-file-image-o\"></i><span class=\"app-menu__label\">" + menusList[i].menuName + "</span></a>";
                }
                /*  archive+="<li ><a class=\"treeview-item\" ><i class=\"icon fa fa-circle-o\"></i>"+archiveBoList[i].date+"</a></li>";*/
                html += title;
                if (menu != null && menu.length > 0) {
                    html += "<ul class=\"treeview-menu\">";
                    for (var j = 0; j < menu.length; j++) {
                        html += "<li><a class=\"treeview-item\" href=\"" + menu[j].url + "\"><i class=\"icon fa fa-circle-o\"></i>" + menu[j].name + "</a></li>";
                    }
                    html += "</ul>";
                }

                html += "</li>";
            }
            console.log("html:" + html);
            $("#treeviewMenuId").append(html);

        }
    })
})

之前;

$("[data-toggle='treeview']").click(function(event) {//此方法jQuery append方法无法调用
    event.preventDefault();
    if($(this).parent().hasClass('is-expanded')) {
        treeviewMenu.find("[data-toggle='treeview']").parent().removeClass('is-expanded');
    }
    $(this).parent().toggleClass('is-expanded');
});

修改;

$("#app-menu").on('click', "[data-toggle='treeview']", function(event) {
    console.log(event);
    event.preventDefault();
    if(!$(this).parent().hasClass('is-expanded')) {
        treeviewMenu.find("[data-toggle='treeview']").parent().removeClass('is-expanded');
    }
    $(this).parent().toggleClass('is-expanded');
})

或者将修改前的函数放入到ajax里面。

猜你喜欢

转载自blog.csdn.net/qq_36348215/article/details/88642838
今日推荐