jquery live自動增加keyup事件

我真的很困惑，甚至不知道如何尋找答案。我收到了一個javascript函數的多個調用。我對我沒有意義。jquery live自動增加keyup事件

以下是代碼的作用。

$('expenses_txt').live(\'keyup\', function() { 
    $(this).typeWatch({ highlight: true, wait: 500, captureLength: 0, callback: calculate_expenses }); 
});

的「Calculate_expenses」是使用jQuery的AJAX調用PHP頁面，返回被顯示在期間數據的JavaScript函數。

我使用螢火蟲來幫助我調試和Calculate_expenses功能，我把一個「console.log」調試時，這個函數被調用。

以下是發生了什麼事情。在DOM發生這種情況時，我只有一個輸入框，當我只按下一個按鍵時，控制檯中的輸出會輸出一個類似於它的調試信息，當我再次在同一個輸入框中按一個按鍵時，控制檯加倍（即Calculate_expenses函數被調用了兩次，但應該只調用一次），當我再次按下某個鍵時（總共進行3次按鍵操作），控制檯中的輸出將輸出3次調用Calculate_expenses函數現在.....等等。我真的不知道這裏發生了什麼事。代碼在我看來，它只會調用Calculate_expenses函數1次，但是當使用螢火蟲時，實際上它會在我不想要的時候被反覆調用。

任何想法？是我使用.live（）的方式如果我只是使用「keyup」事件它工作正常，問題是我需要使用typeWatch插件來延遲ajax調用，直到鍵入完成並且鍵盤事件觸發不久。我使用live（）的原因是因爲我動態地向dom添加元素，並且這是我唯一可以弄清楚如何使用typeWatch和動態添加元素到dom中需要總結的唯一方法...

你的想法是讚賞。謝謝。

來源

2010-02-03 Ronedog

你用什麼方法動態地向dom添加元素？ – user113716 2010-02-03 02:13:15

帕特里克，我早先在另一個問題中提出了你的建議，我不得不使用.clone（true），它解決了keyup沒有被複制到新創建的輸入框的問題。當我嘗試使用typeWatch插件時，問題就出現了......它只能在第一個輸入框中工作，那些動態添加的將不會觸發。我不喜歡之前用.clone（true）解決的問題，我唯一的缺點是「keyup」是標準的，而「typeWatch」不是。任何其他想法？ – Ronedog 2010-02-03 03:33:46

好吧，沒有任何與生活和typewatch工作...解決方法是使用onblur並讓.clone（）複製它。

來源

2010-02-04 16:19:44 Ronedog

$('expenses_txt').live()塊位於哪裏？這聽起來像是被觸發多次。

在$('expenses_txt').live()行上設置一個斷點（firebug腳本選項卡，單擊行號左邊的空白處）。它應該只觸發一次。如果它多次觸發，你會方便地看到一個堆棧跟蹤（這應該導致你回到罪魁禍首）。

另外，在閉包內部（使用typeWatch的地方）設置一個斷點。 typeWatch部分可能是罪魁禍首，因爲它在每個keyup上重新實例化自己（無論this是否已經被「處理」（並且多次綁定回調））

如果它是typeWatch在工作，則需要。檢查它是否以某種方式結合的最簡單的事情將是標誌的DOM元素不知怎的，你可以，例如使用：

jQuery('#element').data('hasTypeWatch',true)

初始設置標誌使用檢查它：

jQuery('#element').data('hasTypeWatch')

檢查插件文檔看它作者已經佔了這個莫名其妙。

來源

2010-02-03 02:11:56 Koobz

我正在通過php添加此頁面並回顯字符串。 Jquery腳本在這個字符串中。我可以將斷點添加到我的.js文件中的所有東西，但是我無法在螢火蟲中看到jQuery腳本將斷點放在.live（）所在的位置。 .live（）位於該腳本的document.ready部分中。我確實認爲.live（）不知何故是罪魁禍首，因爲當我刪除它的時候它就起作用了。問題是我使用.live（），因爲當我動態地向DOM添加一個新元素時，它不會將typeWatch事件附加到它，並且我已經足夠新到jquery，我並不確定要解決什麼問題。 – Ronedog 2010-02-03 03:39:36

對於這種情況，你正處於正確的軌道上（應用現在的事件綁定+任何未來的dom元素 - 這實際上是一個非常酷的想法）。 Firebug的腳本標籤通常會顯示你所有的腳本。js文件，所有動態創建的腳本，以及出現在文檔正文中的任何腳本。搜索（右側）是上下文敏感的，非常有用。你應該可以用它來搜索你的罪魁禍首。腳本選項卡中還有一個向下箭頭，您可以在其中準確配置要顯示的腳本。 – Koobz 2010-02-03 06:34:17

好吧，我想出瞭如何讓dymanic js在firebug中顯示，但我無法弄清楚這個問題。如果我刪除.live（）問題消失了......但我真的需要能夠將動態輸入框綁定到事件上......我必須找到解決方法。無論如何，感謝您的幫助 – Ronedog 2010-02-04 00:50:44

這裏有一個樣機：

function handleData(data){ 
    console.log(data); 
    $("#results").append("<p>"+ data +"</p>"); 
} 

$(function(){ 
    $("#inputElm").focus(); 
    $("#inputElm").live('keyup', function(){ 
     $(this).typeWatch({ 
      callback: handleData, 
      wait: 500, 
      captureLength: 0 
     }); 
    }); 
});

注意控制檯登錄多次打電話給每個KEYUP的typeWatch方法，按照由koobz評論。我想你想省略$。live（）處理程序並簡單地將typeWatch附加到輸入。

來源

2010-02-03 02:26:29 bdl

嗯，我還是很困惑。 Koobz，感謝螢火蟲提示。我發現在哪裏可以看到腳本，但是斷點看起來沒有工作，或者停止代碼，它會停止代碼，只是在主應用程序加載的.js文件中停止代碼，但腳本是動態添加特定頁面加載時似乎無法識別斷點並停在它們，所以我無法逐句通過代碼。

我注意到一些奇怪的東西，但它可能只是我作爲怪人，但jquery函數顯示沒有$（）。例如：在我的源代碼jQuery的代碼是這樣寫的：

$（ 'income_txt'）生活（ 'KEYUP'，函數（）{$ （本）.typeWatch（{亮點：真實， wait：500，captureLength：-1，callback：calculate_income}）; }）;

但看着螢火蟲腳本標籤時，它看起來像這樣：

函數（）{$ （本）.typeWatch（{亮點：真實，等待：500，captureLength：-1，回調：calculate_income }）; }

這是jquery支持做什麼？我假設它被綁定到「選擇器」，因此不需要在它前面顯示選擇器，而只是使用「function（）」...是否正確？

對.live（）的任何其他想法，或者使用typeWatch的其他想法，無論我嘗試什麼，仍會多次調用該函數，除非我刪除.live（）。如果我不使用.live（），則typewatch將在keyup事件上工作，但使用.clone（true）動態添加到dom的新元素不適用於該對象，並且typeWatch不會觸發。我不知道如何將新創建的對象綁定到使用typewatch的事件，而不是使用.live（），這會導致其他問題。如果我忘記使用typeWatch，並將我的keyup事件綁定到選擇器，它的工作原理，但主要的問題是這樣做，它會調用ajax太快，並導致每次擊鍵時出現問題。

有沒有其他方法可以完成我想要做的事情？謝謝你的幫助。

來源

2010-02-03 19:18:38 Ronedog

jquery live自動增加keyup事件

回答

相關問題