如何通過從$ .ajax（）獲取的DOM訪問元素？

我通過$.ajax加載從另一個頁面的一些HTML：

<script type="text/javascript"> 
    $(function() { 
     $.ajax({ 
      url: '/getInfo', 
      context: $('#contentBox'), 
      success: function(data) { 
       $(this).html(data); 
      } 
     }); 
    }); 

    $(function() { 
     $('#clickableElement').click(function() { 
      alert("I work!"); 
     }); 
    }); 
</script> 

<div id="contentBox"></div>

的代碼加載這個HTML到DIV ID爲contentBox：

<p id="clickableElement">I'm clickable.</p>

然而，當我點擊款裝載，沒有警報盒彈出。當涉及到通過AJAX加載的元素時，我不認爲我正確訪問了DOM。我怎樣才能解決這個問題？

來源

2012-02-18 dangerChihuahua007

你還有困難嗎？ – gdoron 2012-02-18 22:49:45

非常感謝，javascript現在正在使用'.on（）'。但是，CSS選擇器不是。 – dangerChihuahua007 2012-02-18 23:53:00

哪些選擇器？ – gdoron 2012-02-18 23:55:03

$(selector).live(events, data, handler);    // jQuery 1.3+ 
$(document).delegate(selector, events, data, handler); // jQuery 1.4.3+ 
$(document).on(events, selector, data, handler);  // jQuery 1.7+

on版本：

$('#contentBox').on('click', '#clickableElement', function() { 
    alert('I work!'); 
});

ondocs：

當提供一個選擇器，該事件處理程序被稱爲委託。當事件直接發生在綁定元素上時，不會調用該處理程序，而只會爲與選擇器匹配的後代（內部元素）調用該處理程序。 jQuery將事件從事件目標引發到處理程序所附的元素（即，最內層到最外層的元素），並沿着匹配選擇器的路徑上的任何元素運行處理程序。

來源

2012-02-18 21:58:17 gdoron

謝謝你的幫助。如何在未命名的函數中訪問ID爲'＃clickableElement'的元素？我現在不能使用'$（this）'，因爲'$（this）'是指ID＃contentBox'的元素，對嗎？ – dangerChihuahua007 2012-02-20 18:50:07

@DavidFaux。 'this'將是clickableElement請參見[this]（http://jsfiddle.net/DXmQU/）DEMO – gdoron 2012-02-21 07:21:18

當瀏覽器運行您的腳本時，沒有節點id = clickableElement，您必須標記該元素也可以在以後創建。

要訪問動態DOM節點，您應該使用jQuery中的on()函數。

來源

2012-02-18 21:54:32 IProblemFactory

'live（）'已棄用。 – kapa 2012-02-18 21:57:17

謝謝，什麼是動態DOM節點？ – dangerChihuahua007 2012-02-18 21:57:57

哦，我的，所以使用http://api.jquery.com/on/作爲沒有廢棄的生活版本.... – IProblemFactory 2012-02-18 21:59:25

如何通過從$ .ajax（）獲取的DOM訪問元素？

回答

相關問題