2014-07-15 106 views
0

這裏的想法是,函數只需要運行任何輸入/ textarea/select的下一個焦點,但是一次性函數可以重置爲再次運行。JQuery將焦點事件附加到下一個焦點輸入

一個簡單的例子是選中了一個複選框,然後在任何其他字段上的下一個焦點事件上運行檢查以查看該字段是否具有特定的屬性值(具有多個可能的字段爲真)。這應該允許用戶取消選擇複選框,然後再次選中複選框以再次觸發相同的事件。

值得注意的是,測試複選框是否被選中不是一個選項,因爲這個附加的焦點事件應該能夠設置模糊,點擊或任何其他類型的字段的jQuery事件。

我現在的想法是設置在處理每個焦點事件查了全局JavaScript變量:

var checkFocus = false;

然後,設置焦點事件的所有表單域,包括輸入,文本區域等:

$('input').focus(function(){ 
    if(checkFocus){ 
    // Put the target code here. 
    checkFocus = false; 
    } 
}); 

這將允許代碼的任何部分將checkFocus設置爲true,然後告訴焦點事件運行目標代碼。

有沒有辦法抓住每個元素的所有焦點事件?如果是這樣,是否有辦法運行一次性事件,如果需要,還可以設置爲再次運行一次?

編輯

有一種方法,使一個焦點事件,一時間只事件,但這並不包括任何形式的字段不是輸入的元素,如文本區域或選擇。這可以使用off(event)函數完成。我不確定這是否對這個問題有所幫助,因爲對其他選擇器的這樣做實際上會使代碼多次出現。

$("input").on("focus", function(event) { 
    alert("This will be displayed only once."); 
    $(this).off(event); 
}); 
+0

如果收音機被選中,你只是想在元素的焦點上執行某些操作?或者是其他東西? –

+0

是的,但收音機的值應與焦點事件中的目標代碼無關。 – Siphon

+0

需要玩的東西是使用jQuery的one()來附加處理程序,並在處理程序內再次附加。 –

回答

0

經過廣泛的谷歌搜索,我能回答我的問題...

這是你將如何設置事件(這可以在任何地方設置):

var id = 'something'; 
var name = 'something-else'; 

// Bind the event to three tags commonly used on forms 
$("input, select, textarea").on("focus", {id: id, name: name}, focusEvent); 

這是focusEvent函數,將處理上的場聚焦的邏輯:

var focusEvent = function(event){ 
    // Commonly used values for an event 
    var id = event.data.id; 
    var name = event.data.name; 
    var focused_id = $(this).attr('id'); 
    var focused_name = $(this).attr('name'); 

    // Do something on the next focus event 

    // Unbind the one-time event 
    $("input, select, textarea").off("focus", focusEvent); 
} 

這是我能想到的最簡單的設置,不需要全局變量,也不需要設置需要單獨處理的多個事件。

最初未包含在問題中的一個部分是.on()函數使用event.data將參數傳遞給定義的事件函數的能力。這最終使我在編寫焦點事件邏輯時變得更加輕鬆。

另外,這個解決方案的好處在於事件可以取消綁定,具體取決於事件函數的邏輯。這可以將一次性事件轉變爲可能的一次性事件。