不確定.on（）方法

我正在使用$.click()方法來觸發某些事件。但是之後我需要在聲明元素之前爲某些HTML元素設置一些事件。讓我們以此爲例：不確定.on（）方法

<script> 
    $('div.hide').click(function() { 
     $('div.hide').css({'display' : 'none'}); 
    }); 
</script> 
<div class="hide">some text</div>

不足之處是設置.click()方法時，div.hide元素不存在，所以沒有觸發設置。

於是我轉向.on()方法，像這樣：

<script> 
    $('div.hide').on('click', function() { 
     $('div.hide').css({'display' : 'none'}); 
    }); 
</script> 
<div class="hide">some text</div>

但這也不起作用。我想調用.on()會使所有存在和將來的div.hide元素觸發'click' function()。

我設法克服了這個不便，但爲了我自己的知識，我想知道我做錯了什麼。有沒有辦法將觸發器分配給未來的HTML元素？

我solituion是：

<script> 
    $(document).ready(function() { 
     $('div.hide').click(function() { 
      $('div.hide').css({'display' : 'none'}); 
     }); 
    }); 
</script> 
<div class="hide">some text</div>

來源

2012-06-11 Sorin Buturugeanu

注意有關'$（文件）。就緒（函數（）{}）;'包裝，即爲文檔就緒事件添加事件處理程序，以便在該事件觸發之前，內部代碼不會運行。這可以確保頁面在腳本運行之前完全呈現，而不是在JavaScript頁面呈現期間解析並運行的時候。 –

你錯過了三個參數的版本：

$('body').on('click', 'div.hide', function() { ... });

這使處理程序上<body>但它捕獲的事件泡沫和調用處理程序時，目標元素與選擇器（第二個參數）相匹配。

該處理程序不必去<body>;它可以是您的<div>的任何父容器元素。

「on」方法取代了舊的「活」和「委託」方法，以及「綁定」本身。

來源

2012-06-11 15:35:57 Pointy

'on'超負載是一個壞主意的另一個原因。正是出於這個原因，我總是使用'delegate'來代表授權，'on'（或其中一個捷徑）代表不授權。 –

@ T.J.Crowder是的，我真的不明白這是什麼意思。 – Pointy

我認爲這裏重要的一點是它需要在某個地方附加事件，並且DOM中CLOSEST可能的位置是理想/最好的地方，所以帶有ID的DIV插入不存在的元素會是最好的。 +1，因爲OP似乎不明白對不存在的元素的附加依然沒有附加。 –

-2

使用jQuery.live method附加的事件處理程序的當前選擇現在匹配這，所有的元素和未來

來源

2012-06-11 15:53:31 Nayjest

1.7版引入的「.on（）」方法取代了」 .L ive（）「方法。的確，「.live（）」本身在很久以前被「.delegate（）」所取代。 – Pointy

不確定.on（）方法

回答

相關問題