2014-02-26 19 views
1

我有一個自定義的jQuery事件這樣jQuery的 - 自定義事件的使用方法

jQuery(this).trigger({ 
    type: 'my_own_event', 
    data1: 'foo', 
    data2: 'bar' 
}); 

要附加一個事件處理程序我不得不使用.on()功能這樣的。

jQuery(element).on('my_own_event', function(e) { 
    //Do something 
}); 

我如何使用它像像.click().keyup()任何其他內置的事件。事情是這樣的

jQuery(element).my_own_event(function(e){ 
    //Do Something 
}); 

我試着用jQuery.fn這樣做如下

jQuery.fn.my_own_event = function(callback) { 
    jQuery(this).on('my_own_event',callback); 
} 

和它在Firefox 27

工作這是這樣做的正確方法?

可以在事件名稱中使用下劃線嗎?

+0

這是做到這一點的正確方法嗎?是它是 是否確定使用下劃線的事件名稱?如果你問我,這是一個偏好問題 –

回答

1

這很好。命名是好的,僅僅是一個慣例。

雖然你應該調整快捷功能。 jQuery()不是必需的,因爲this已經是jQuery對象。您還應該返回原始對象進行鏈接。

您可能還想要像內置事件快捷方式那樣處理調用的空參數版本來觸發事件。

這裏是jQuery的源本身是怎麼做的:

jQuery.fn[ name ] = function(data, fn) { 
    return arguments.length > 0 ? 
     this.on(name, null, data, fn) : 
     this.trigger(name); 
}; 

哪裏name是事件如clickkeyup。這也處理可選的data參數,該參數將在回調函數中設置event.data

然後你完全符合現有的jQuery事件快捷方式函數約定。

所以,你的例子可以改爲:

jQuery.fn.my_own_event = function(data, callback) { 
    return arguments.length > 0 ? 
     this.on('my_own_event', null, data, callback) : 
     this.trigger('my_own_event'); 
}; 
1

是您所創建的自定義事件是好的,事件名稱也按標準事件命名約定

文章從官方jQuery的網站:

.trigger()方法可以觸發這兩個標準的瀏覽器事件名稱和自定義事件名稱以調用附加的處理程序。事件名稱只能包含字母數字,下劃線和冒號字符。

REF:

https://api.jquery.com/trigger/

編碼快樂:)