爲什麼要在$（document）.ready（）中包含$ .click（）？

我正在通過http://docs.jquery.com/How_jQuery_Works，發現要求在$(document).ready()附上$.click()事件甚至有點奇怪。我的難點如下：

當文檔載入時，控制將進入$(document).ready()功能，但它會繼續執行$.click()？（基於它不會的行爲，但是當控件進入正常功能時，爲什麼它不會輸入$.click()函數？）
由於用戶只能在文檔準備好後才能看到url，是否真的需要在$(document).ready()內嵌入$.click()？

2012-04-10 Rajkumar Masaniayan

的How jQuery Works document使用的結合.click()的$(document).ready()內是一定的，爲所述功能執行時已經創建的元件的.click()事件所綁定的示例。

的.click()調用一個函數作爲其參數不執行其前述選擇器相匹配的節點上的.click()，而是結合的功能匹配的節點onclick。

如果你試圖做這樣的事情：

$('a').click(function(){ 
    alert('clicked me'); 
});

...文檔中<head>或任何<a>元素已經呈現之前，該事件將不會得到，因爲沒有節點綁定到任何節點匹配$('a')選擇器在執行該函數時存在。

此外，如果您在創建一些<a>標記時執行了此操作，則只有已經創建的標記纔會獲得綁定事件。 <a>函數綁定後創建的標籤將不具有.click()綁定。

所以在jQuery的（和其他JavaScript框架），你會經常看到添加事件處理，結合小部件等，裏面$(document).ready(function(){});

來源

2012-04-10 16:38:06

的慣例是，你需要確保的DOM元素你正在添加的點擊處理程序存在，任何你知道這是由文檔準備就緒。

來源

2012-04-10 16:38:26 Maess

看起來像有人打我19秒:) – Maess 2012-04-10 16:39:00

這不是對.click()的實際調用，這是此處所關注的問題，而是它所調用的元素的選擇器。

例如，如果沒有與id="myButton"一個元素，那麼你將與引用它：

$('#myButton')

然而，如果該元素還沒有加載（即，如果該文件還沒有準備好你不知道知道什麼元素是當前加載），那麼這個選擇器不會找到任何東西。所以它不會在任何事情上調用.click()（或者綁定事件或者觸發它，具體取決於.click()的參數）。

您可以使用其他方法，such as the jQuery .on() function，它可以將事件綁定到常見的父元素，並過濾稍後在文檔生命週期中稍後添加的事件的「冒泡」事件。但是，如果你只是使用普通的選擇器並調用一個函數，那麼選擇器需要在DOM中找到一些東西，以便函數執行任何操作。

來源

2012-04-10 16:40:45 David

JavaScript一般在閱讀標籤後立即開始執行。這意味着，在將腳本放在首位的標準練習中，您還沒有創建任何元素來綁定點擊處理程序。即使身體元素還不存在。使用jQuery.ready會延遲執行代碼，直到所有DOM元素都被加載完畢。

來源

2012-04-10 16:41:03

$(document).ready(..)方法試圖解決的問題是頁面的JavaScript代碼的執行和頁面中控件的綁定時間之間的張力。一旦文檔準備就緒並且DOM元素可用，則ready函數將被觸發，因此JavaScript代碼可以對DOM進行合理的假設。最常見的例子是javascript代碼相對於它嘗試操作的DOM元素的位置上。考慮

<script> 
$('#target').click(function() { 
    alert('It was clicked'); 
}); 
</script> 
<div id="target">Click Me</div>

在這個特定的例子中，javascript將不會按預期運行。當輸入腳本塊時，將運行click行，並且當前沒有編號爲target的DOM元素，因此該處理程序無關聯。代碼沒有什麼錯，它只是在創建DOM元素之前運行不幸的時機。

在這個例子中，問題很明顯，因爲代碼和DOM元素在視覺上配對在一起。在更復雜的網頁中，儘管JavaScript通常是完全獨立的文件，並且沒有關於加載順序的視覺保證（也不應該）。使用$(document).ready(..)抽象消除了排序作爲問題的潛在來源的問題，並有助於恰當地分離問題

來源

2012-04-10 16:43:22 JaredPar

爲什麼要在$（document）.ready（）中包含$ .click（）？

回答

相關問題