如何在div添加到dom後運行jquery函數？

Question

我正在使用一個使用jquery創建手風琴的插件。然而，我的jquery函數在dom被操作之前運行，並且我在我的函數中定位的div id已經創建。這是我的功能。

jQuery('#_Offer_Something').click(function(){ 

     if(!confirm('Delete?')) { //show confirm dialog 
      return false; //do nothing if cancel is clicked (prevent the browser from following clicked link) 
     }else{ 
      window.location.replace("http://stackoverflow.com"); 
    } 
}); 

所以基本上這是行不通的，因爲div還不存在。

Answer 1

編輯

在特定情況下可以使用：.on()

(function($){ // remap the '$' symbol to jQuery 

    $(document).on('click', '#_Offer_Something',function(){ 
    // ^^^^ or 'body' or a parent element 
     if(!confirm('Delete?')) { //show confirm dialog 
      return false; //do nothing if cancel is clicked (prevent the browser from following clicked link) 
     }else{ 
      window.location.replace("http://stackoverflow.com"); 
     } 
    }); 

})(jQuery); 

以上將作爲現在反對的jQuery .live()方法。
請確保您已將您的jQuery <script>標記放置在</body>標記之前。

Answer 2

$(document).ready(function(){ 
    ... code here ... 
}); 

或

$(function(){ 
    ... Code here ... 
}); 

Answer 3

使用jQuery on只有在插入元素後才能綁定或綁定元素。示例請參閱http://api.jquery.com/on/。簡單的例子：

$(document).on('click', '#_Offer_Something', function(){}); 

Answer 4

如果創建動態的某個頁面加載後您的DOM對象，那麼你將要使用委託事件處理，以便從它的活動將有所回升，即使安裝了事件處理程序之前的相關對象。你可以做到這一點與jQuery的1.7+使用.on()動態形式：

jQuery(document).on('click', '#_Offer_Something', function(){ 

     if(!confirm('Delete?')) { //show confirm dialog 
      return false; //do nothing if cancel is clicked (prevent the browser from following clicked link) 
     }else{ 
      window.location.replace("http://stackoverflow.com"); 
    } 
}); 

從技術上講，這種工作方式是，所有點擊事件冒泡祖先鏈（除非一些沿途的對象將停止起泡過程） 。在這種情況下，我們在document對象上安裝點擊處理程序，並監視與匹配#_Offer_Something選擇器的對象相關的點擊事件。

爲獲得最佳性能，您不會實際將此事件處理程序綁定到document對象。相反，您將選擇在安裝事件處理程序時存在的靜態父對象（某些父級爲#_Offer_Something）。我選擇document對象只是因爲你沒有透露你的HTML的其餘部分，所以我不知道什麼是更好的選擇。