Ajax非同步擷取html資料中包含js方法無效的解決方案

標籤：toolbar   cli   html   demo   click   時間   method   tool   pos   

頁面上使用js寫了一個擷取後台資料的方法

function data() {        var tab = $("#dic")        $.ajax({            url: ‘../demo.ashx?method=GetList‘,            data: {},            dataType: ‘json‘,            type: ‘post‘,            async: true,            success: function (data) {                //console.log(data);                var parentStr = ‘‘;                $.each(data, function (i, item) {                    //console.log(item.text);
                    
                    parentStr += "<div class=‘pull-right‘> <a class=‘morechange‘ href=‘javascript:;‘ style=‘visibility: visible;‘>更多+</a></div>"

});
tab.html(parentStr);
}
})

}

其中的

<a class=‘morechange‘ href=‘javascript:;‘ style=‘visibility: visible;‘>更多+</a>  綁定一個點擊時間

$(‘.morechange‘).click(function(){    alert("彈出")});

發現點擊無效無效

  原來是 ajax載入新dom之前js 就載入完了，事件當然沒有綁定到新載入的dom上

 

解決方案：

   使用jquery的委託事件，將該方法委託到頁面已經存在的一個節點上

$("#dic").delegate(‘.morechange‘, ‘click‘, function () { alert("彈出"); });

 問題解決。

當然也可以不使用非同步將async改為false也是可以的

-轉載

Ajax非同步擷取html資料中包含js方法無效的解決方案