將onBlur添加到所有表單元素

因此，在特定頁面上，我擁有一些表單元素數量，可以是3到8之間的任意值，具體取決於用戶及其在頁面上的操作。將onBlur添加到所有表單元素

如何在頁面上動態添加一個特定的onblur事件到所有的表單元素？

如果我有：

function doThisOnBlur() { stuff }

如何添加相同的功能，所有的這些曾經在頁面加載。頁面加載後不會創建元素，但不同的用戶可能會看到不同的元素。

<input type="text" id="x"> 
<input type="text" id="y"> 
<select id="z">...</select>

這可能嗎？

來源

2010-06-24 Jason

具體作爲每個元素獨特？在動態創建的元素上飛行嗎？ – Matt 2010-06-24 19:02:13

編輯：對於更新的問題
使用.blur()併爲此匿名函數（不要緊多少個元素有）：

$(":input").blur(function() { 
    //do stuff 
});

如果您需要綁定某些功能在某一特定區域，在名稱上使用類或attribute selector，任何可以區分它們的東西......如果選擇器沒有找到一個元素，它就不會將事件處理程序綁定到任何東西。這樣，相同的整體代碼適用於全部用戶，即使他們只能看到某些的可用表單元素。

對於原來的問題：如果元素被頁面加載後動態地添加。
我認爲.live()捕捉blur事件後，你在這裏是什麼，使用:input的選擇：

$(":input").live('blur', function() { 
    //do stuff 
});

來源

2010-06-24 19:01:19

或'$（「：input」）。blur（function（）{..}）;'實時觀看未來元素的頁面，如果頁面加載後沒有添加元素，這並不是真的需要。兩者都可以工作。 – 2010-06-24 19:09:19

@Jim - 這個問題在我發佈這個答案後進行了編輯以澄清，我將更新以包括他的編輯。 – 2010-06-24 19:14:45

沒有jQuery的：

function doThisOnBlur(){ 
// your fancy code 
} 

var inputs = document.getElementsByTagName('input'); 
var selects = document.getElementsByTagName('select'); 

for (var i = 0; i < inputs.length; i++) 
    inputs[i].onblur = doThisOnBlur; 
for (var i = 0; i < selects.length; i++) 
    selects[i].onblur = doThisOnBlur;

我做了最簡單的，我可以。我會重構這個，不要這樣分配事件處理程序，但我指出要回答你的問題。

來源

2010-06-24 19:08:44 Matias

這是如何工作的動態添加元素？ :) – 2010-06-24 19:09:39

如果你想動態元素綁定，那麼我會使用jQuery：活着做到這一點，他們幾乎已經把這個功能下到了T恤！ – RobertPitt 2010-06-24 19:14:54

不知道爲什麼我寫了這個，我應該檢查你的名字，並意識到你發佈了一個答案不是問題：/對不起 – RobertPitt 2010-06-24 19:15:45

將onBlur添加到所有表單元素

回答

相關問題