通過AJAX呈現表單時不適用於表單的jQuery代碼

我的應用程序中使用jQuery的懸停事件具有相當標準的星型投票功能。一旦DOM被初始加載（HTML請求），星形投票邏輯就會用於頁面的其餘部分。但是，我想移動部分，以便它不會加載頁面，但可以在用戶需要時加載。我做了一個典型的AJAX請求來加載部分，但是當它被渲染時，星星不會像鼠標懸停一樣對事件做出正確反應。這個問題是由於我通過AJAX呈現表單或者在我的代碼中存在一個錯誤嗎？感謝您的幫助通過AJAX呈現表單時不適用於表單的jQuery代碼

更新：得到它使用on處理程序，感謝所有幫助！

來源

2012-05-19 Steve

向我們展示代碼......否則說出現的情況就像是告訴機械師你的引擎出了什麼問題，我發出聲音。 –

你很可能試圖將事件綁定到DOM中不存在的節點。解決此問題的最佳方法是綁定到Ajax請求之前存在的偵聽器，該偵聽器是被提取內容的祖先（有時不正確地稱爲「父級」，它只是祖先的一個級別）。例如，鑑於此標記在頁面本身：

<div id="ajaxContainer"> 
    <!-- content will be periodically replaced with Ajax --> 
</div>

「ajaxContainer」是什麼你要獲取的祖先。然後，您需要使用適當的方法綁定偵聽器。在過去，您可以使用live()，但不推薦使用，並且效率也不高。然後推薦給delegate()，解決了效率問題。現在它的代理偵聽器語法爲on()，與delegate()的性能大致相同，但語法不同。

就這麼說吧，如果你使用jQuery 1.7+，可以使用.on()。

想象一下，您的Ajax函數將檢索包含您的星系統mouseover的一部分頁面，該頁面位於一系列歸類爲「星星」的div中。語法可能看起來像：

$(document).ready(function() { 
    $('#ajaxContainer').on('mouseenter', '.stars', function() { 
    $this = $(this); // cache this specific instance of a stars div as a jQuery object 
    // do stuff with $this 
    }); 
});

這是說「開始內部ajaxContainer監聽匹配的事件‘鼠標進入明星的div’，這時，做的東西。」

來源

2012-05-19 07:41:07

jQuery具有一個名爲live的函數，它允許您將事件處理程序應用於尚未創建的對象。

如評論中所述，使用on（）代替。

來源

2012-05-19 07:28:51

_As of jQuery 1.7，.live（）方法已被棄用。使用[.on（）]（http://api.jquery.com/on/）附加事件處理程序。老版本的jQuery用戶應該優先使用[.delegate（）]（http://api.jquery.com/delegate/）.live（）._ – Andreas

我不知道，謝謝你的信息！ –

-1

如果您在AJAX腳本中使用jQuery，請務必使用jQuery而不是$。

jQuery(selector [, context])

而不是

$(selector [, context])

來源

2012-05-19 07:31:11 dcd0181

了與阿賈克斯創建將不會對你的事件處理程序作出迴應，作爲事件處理程序僅在存在於DOM在initializiation的時間要素的工作內容。

您需要委託並偵聽DOM中存在的元素上的事件，並捕獲動態元素的冒泡。

你應該使用on()此：

$('#nonDynamicElement').on('mouseenter', '#dynamicElement', function() { 
    //do stuff 
});

來源

2012-05-19 07:35:50 adeneo

由於從jQuery的1.7+你應該爲老版本的jQuery，你可以使用實時使用上（）（）

來源

2012-05-19 07:40:12

通過AJAX呈現表單時不適用於表單的jQuery代碼

回答

相關問題