jQuery - 如何將事件綁定到將在稍後顯示的隱藏元素？

我想附加'點擊'事件到一個特定類的所有元素。問題是一些元素在事件被綁定時被隱藏的標籤（display：none）。（.bind（））。看起來，當這些元素被顯示時，事件不再受限制。jQuery - 如何將事件綁定到將在稍後顯示的隱藏元素？

$('a.someClass').bind('click', function(){ 
    alert("test"); 
});

隱藏的元素似乎沒有單擊事件綁定。如果我選擇隱藏元素：

$('a.someClass:hidden').bind('click', function(){ 
    alert("test"); 
});

當這些元素不再隱藏時，似乎點擊事件未被綁定。有沒有人經歷過這個？有沒有辦法綁定和事件的元素，無論其顯示屬性？

感謝

來源

2011-04-13 Nick

測試你的選擇，以確保它是選擇隱藏要素可見的元素，這些元素顯示：無尚可嘗試$（'a.someClass：hidden'）。如果你的選擇器是正確的，看看返回的結果是什麼樣的 – derek 2011-04-13 21:12:37

'不管'或'irrespective'從不'irregardless';） – osullic 2016-04-07 16:22:59

編輯2年後：正如一些人指出的那樣，Live功能現在已經過時（你也可以看到，在所鏈接的文檔頁面的頂部）。當前版本的正確事件處理程序名稱將爲On。馬克西姆的答案就是一個很好的例子。

原來的答覆：
您是否嘗試過使用Live()？

.live('click',function(){/* code */});

？

_{版本說明：live已在jQuery 1.7中被棄用，並在jQuery 1.9中被刪除。這個答案是唯一正確的jQuery的版本比jQuery的1.7}

來源

2011-04-13 21:03:06 Damb

+1我哈d同樣的想法 – 2011-04-13 21:07:57

甜。謝謝！！ – Nick 2011-04-13 21:21:09

.live現在不推薦使用.on或.delegate api.jquery.com/live – JudgeProphet 2013-05-16 14:41:48

年長根據在http://api.jquery.com/live/

jQuery的文檔附加的處理程序，爲當前選擇，滿足其所有元素的事件，現在和未來

下面是如何使用它的一個例子：

<!DOCTYPE html> 
<html> 
<head> 
    <style> 
    p { background:yellow; font-weight:bold; cursor:pointer; 
      padding:5px; } 
    p.over { background: #ccc; } 
    span { color:red; } 
    </style> 
    <script src="http://code.jquery.com/jquery-1.5.js"></script> 
</head> 
<body> 
    <p>Click me!</p> 

    <span></span> 
<script> 
    $("p").live("click", function(){ 
     $(this).after("<p>Another paragraph!</p>"); 
    }); 
</script> 

</body> 
</html>

來源

2011-04-13 21:07:14

使用委託（注意，這是你取消隱藏後，他們）：

$('body').delegate('.someClass', 'click', function (evt) { 
    // do something here 
});

來源

2011-04-13 21:08:14 forthehackofit

在jQuery 1.7的.live()方法已經過時了。

您現在可以使用.on()方法。通過將委託事件附加到運行jQuery時在HTML中可查看的元素。

所以，如果a.someClass隱藏運行jQuery的時候，你應該委派事件附加在身上，所以當有在未來可見的a.someClass元素，它將運行，例如：

$('body').on('click','input.a.someClass',function(){ 
    alert("test"); 
});

來源

2012-06-15 12:14:08

假設您調用一個呈現HTML塊的模板最初隱藏的頁面，並且該塊具有一些內聯javascript（對於它自己），上面的代碼不會被觸發，因爲它位於該隱藏元素內。有沒有解決方案，以便內嵌JavaScript也會被觸發？ – basZero 2013-06-11 15:54:26

時報已經改變了，現在可以使用「。在」

.on('click',function(){/* code */});

來源

2013-06-20 21:47:52

你爲什麼要重複[Maxim McNair的答案]（http://stackoverflow.com/a/11050439/499214）？ – 2013-06-21 05:10:16

當時Maxim使用'.live（）'而不是'.on（）'。檢查更新日誌。 – 2017-01-25 01:28:21

瞭解，謝謝。您現在可能仍想刪除您的答案，因爲它重複了另一個答案。 – 2017-01-25 01:36:39

使用

$('parentelement').on('click','taget element',function(){ 

})

parentelement應該在頁面加載

來源

2016-09-21 05:01:02 Vipin

jQuery - 如何將事件綁定到將在稍後顯示的隱藏元素？

回答

相關問題