Ajax異步獲取html數(shù)據(jù)中包含js方法無效的解決方法

更新時間：2017年02月20日 14:55:21 作者：代碼小六

本文主要介紹了Ajax異步獲取html數(shù)據(jù)中包含js方法無效的解決方法，具有很好的參考價值，下面跟著小編一起來看下吧

頁面上使用js寫了一個獲取后臺數(shù)據(jù)的方法

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("彈出")
});

發(fā)現(xiàn)點擊無效無效

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

解決方法：

使用jquery的委托事件，將該方法委托到頁面已經(jīng)存在的一個節(jié)點上

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

問題解決。

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

以上就是本文的全部內容，希望本文的內容對大家的學習或者工作能帶來一定的幫助，同時也希望多多支持腳本之家！

您可能感興趣的文章:

ajax
異步

jQuery AjaxUpload 上傳圖片代碼
這篇文章主要介紹了jQuery AjaxUpload 上傳圖片代碼的相關資料,需要的朋友可以參考下
2016-02-02
jquery實用代碼片段集合
學習jquery與正在使用jquery的朋友可以參考下。很多使用的代碼，可以直接拿來使用。
2010-08-08
判斷瀏覽器的內核及版本號方法匯總
這篇文章主要介紹了判斷瀏覽器的內核及版本號方法匯總,需要的朋友可以參考下
2015-01-01
jQuery實現(xiàn)可拖動的浮動層完整代碼
使用jQuery實現(xiàn)可拖動的浮動層的完整代碼，復制保存到html文件就可以體驗效果.光標移動到層上，按住鼠標就可以拖動層
2013-05-05
jquery.cookie.js 操作cookie實現(xiàn)記住密碼功能的實現(xiàn)代碼
jquery.cookie.js操作cookie實現(xiàn)記住密碼功能，很簡單很強大，喜歡的朋友可以參考下。
2011-04-04
jquery中focus()函數(shù)實現(xiàn)當對象獲得焦點后自動把光標移到內容最后
當對象獲得焦點后，自動把光標移到內容最后，使用focus()函數(shù)便可實現(xiàn)，下面有個不錯的示例，感興趣的朋友可以參考下
2013-09-09
Jquery 復選框取值兼容FF和IE8(測試有效)
Jquery 復選框取值的文章網(wǎng)上有很多的，不過可以同時兼容FF和IE8的確實沒有幾個，下面有個不錯的方法經(jīng)測試有效
2013-10-10
利用jquery實現(xiàn)實時更新歌詞的方法
這篇文章主要給大家介紹了如何利用jquery實現(xiàn)實時更新歌詞的方法,文中給出了詳細的實現(xiàn)思路和示例代碼，對大家的參考借鑒具有一定的價值，有需要的朋友下面來跟著小編一起學習學習吧。
2017-01-01
jQuery中調用WebService方法小結
以前在寫ajax請求時，總是喜歡使用jQuery+ashx的方式進行調用，今天采取jQuery+WebService的方法來做ajax請求，發(fā)現(xiàn)這種方式比使用ashx的方式要更方便。
2011-03-03
jQuery點擊tr實現(xiàn)checkbox選中的方法
jQuery點擊tr實現(xiàn)checkbox選中的方法，需要的朋友可以參考一下
2013-03-03