jQuery AJAX - 創建DOM元素

我在jQuery中使用AJAX和PHP獲取新帖。然後創建一個新的div並將其添加到它。jQuery AJAX - 創建DOM元素

這裏是我的代碼：

function getMorePosts(latestPost){ 

    $.ajax({ 
     type: "POST", 
     url: "/includes/classes/handler.php?do=getMorePosts", 
     data: "&latestPost="+latestPost, 
     cache: false, 
     success: function(data){ 
      if(data){ 
       $('#addUpdate textarea').val(''); 
       $('<div id="newPosts"></div>').insertAfter('.myDeskAdd'); 
       $(data).prependTo('#newPosts'); 
      } 
     } 
    }); 
    return false; 
}

現在，數據是所有的HTML代碼從我handler.php。一切正常，它是附加的，我可以在屏幕上看到結果。這是正確的 - 很好！

但這裏是我的問題：當它添加到屏幕上，它就像我不能「使用」的DOM元素。例如：我有一個圖像，我可以點擊，然後它必須從jQuery調用一個警報，但事實並非如此。而綁定到創建的dom元素的所有其他jQuery效果都不起作用。

這些元素不工作，如果我按F5確實工作。

我試過html(),prepend(),append()等等。

來源

2012-03-14 skolind

你必須重新綁定的事件處理程序的內容被附加到頁面後。或者查看jQuery的'on'來委派事件。 – 2012-03-14 13:02:23

如何重新綁定事件處理程序？我會看看 – skolind 2012-03-14 13:03:49

所有動態內容（從ajax加載），綁定方法使用jQuery在。那麼它應該工作

，而不是這個，

$(".imageClass").click(function(){ 
    alert($(this).html());  
});

使用此

$(".yourContainerDiv").on("click", ".imageClass", function(event){ 
    alert($(this).html());  
});

http://api.jquery.com/on/

來源

2012-03-14 13:04:28 Shyju

我會完全刪除我的正常click（）方法，並用.on（）替代它嗎？或者我應該在我的函數getMorePosts（）中使用on（）。？ – skolind 2012-03-14 13:16:37

是的。用代碼替換。 – Shyju 2012-03-14 13:31:24

但是，當點擊星形圖標時，我不需要將處理程序綁定到元素。我需要通過ajax函數將處理程序綁定到新加載的元素。我會怎麼做？ – skolind 2012-03-14 13:34:12

您需要使用live()或on()使用適當的參數將事件綁定到新添加的DOM元素。

來源

2012-03-14 13:03:28

live（）已被棄用 – Starx 2012-03-14 13:04:33

除非你使用事件委託，事件處理程序僅適用於存在當代碼綁定它們運行，所以任何動態地添加元素以後將不會有事件處理程序的約束，你的功能將無法正常工作元素。

看看在.on()（jQuery的1.7+）或.delegate()（之前的jQuery 1.7）的事件委派的詳細信息的功能。

來源

2012-03-14 13:04:02

當動態生成元素時，它們不會附加到以前的事件處理程序。

您必須使用。 on()方法委託事件處理程序。

例子：

$(".yourmajoreventhandler").on('click', function() { 
    //do your stuff 
});

代表團舉例：現在

$("body").on('click', ".yourmajoreventhandler", function() { 
    //do your stuff 
});

，每一次，你生成yourmajoreventhandler類元素的上述功能將運行。

來源

2012-03-14 13:04:04 Starx

'.on（）'的使用不會設置事件委託，這是動態生成內容所需的。 – 2012-03-14 13:05:10

@AnthonyGrist，它的確如此。在評論之前，你爲什麼不做研究？ '$（元素）。在（「點擊」，「選擇」，函數（）{}）;' – Starx 2012-03-14 13:17:10

@AnthonyGrist，看看[這裏]（http://jsfiddle.net/Starx/TSqbs/1/）演示從我的另一個答案來證明我的觀點 – Starx 2012-03-14 13:23:01

事件如何綁定到要添加的DOM元素？他們是元素的屬性還是你使用jQuery綁定它們？如果它是前者，則需要發佈更多代碼，但我猜測它是後者，在這種情況下，您將需要使用jQuery's on method來綁定您的事件。

當您綁定的事件它僅適用於當前存在的元素。他們不會傳播到新的元素。使用on()方法通過綁定到所有新元素來解決此問題。

來源

2012-03-14 13:04:12 jasonlfunk

jQuery AJAX - 創建DOM元素

回答

相關問題