jquery事件機制擴展插件 jquery鼠標右鍵事件
更新時間:2011年12月21日 19:26:22 作者:
jquery其實本身的事件機制就很完善了,包括了單擊,雙擊,鼠標移入,鼠標移出等。但是卻少了一個做事件。就是鼠標右擊事件。當然大家也是直接用偵聽鼠標按下事件,然后通過if來判斷執(zhí)行相應的函數(shù)。造成鼠標右擊事件的效果
因為最近技術長進緩慢,也沒高手帶,只能靠自己了,所以想仿個WEBQQ來鍛煉下自己。做之前最好先把必要的東西準備好。jquery其實本身的事件機制就很完善了,包括了單擊,雙擊,鼠標移入,鼠標移出等。但是卻少了一個做事件。就是鼠標右擊事件。當然大家也是直接用偵聽鼠標按下事件,然后通過if來判斷執(zhí)行相應的函數(shù)。造成鼠標右擊事件的效果。
但是這不是我想要的,我想要的似乎這個事件可以跟其它事件比如單擊事件一樣??梢员环奖愕氖褂茫恍枰看味既ヅ袛?。這里通過編寫jquery插件的形式擴展,讓這個方法可以直接使用$().rightClick();來使用。
jQuery的插件主要分3種類型
1.封裝對象方法的插件
(這種插件是將對象封裝起來,用于對通過選擇器獲取的對象進行操作,也就是這里需要用到的方法)
2.封裝全局函數(shù)的插件
(可以將獨立的函數(shù)加入到jquery的命名空間下)
3.選擇器插件
(雖然jquery的選擇器已經(jīng)很強大了,但還是會需要擴展一些自己喜歡的選擇器)
其它的一些關于插件的知識大家可以自己去查閱相關資料。這里就直接開始講了。
這里是使用的第一種插件類型,先分析下具體的編寫思路。
1.使用鼠標右鍵事件后,將禁止所有的系統(tǒng)右鍵菜單功能
2.綁定鼠標右鍵事件后,實際是觸發(fā)鼠標按下事件。
3.通過if來判斷,如果按下的是右鍵則執(zhí)行參數(shù),這個參數(shù)只能是函數(shù)。如果不是右鍵則不執(zhí)行。
相信講到這里,對jquery很熟悉的也明白要怎么做了。
jquery事件機制擴展,jquery鼠標右鍵事件。
/*鼠標右鍵插件*/
(function($) {
$.fn.extend({
//定義鼠標右鍵方法,接收一個函數(shù)參數(shù)
"rightClick":function(fn){
//調用這個方法后將禁止系統(tǒng)的右鍵菜單
$(document).bind('contextmenu',function(e){
return false;
});
//為這個對象綁定鼠標按下事件
$(this).mousedown(function(e){
//如果按下的是右鍵,則執(zhí)行函數(shù)
if(3 == e.which){
fn();
}
});
}
});
})(jQuery);
$(document).ready(function(e){
$("body").rightClick(function()(alert("右鍵單擊")));
});
jquery事件機制擴展,jquery鼠標右鍵事件。
使用方法跟其它事件一樣
但是這不是我想要的,我想要的似乎這個事件可以跟其它事件比如單擊事件一樣??梢员环奖愕氖褂茫恍枰看味既ヅ袛?。這里通過編寫jquery插件的形式擴展,讓這個方法可以直接使用$().rightClick();來使用。
jQuery的插件主要分3種類型
1.封裝對象方法的插件
(這種插件是將對象封裝起來,用于對通過選擇器獲取的對象進行操作,也就是這里需要用到的方法)
2.封裝全局函數(shù)的插件
(可以將獨立的函數(shù)加入到jquery的命名空間下)
3.選擇器插件
(雖然jquery的選擇器已經(jīng)很強大了,但還是會需要擴展一些自己喜歡的選擇器)
其它的一些關于插件的知識大家可以自己去查閱相關資料。這里就直接開始講了。
這里是使用的第一種插件類型,先分析下具體的編寫思路。
1.使用鼠標右鍵事件后,將禁止所有的系統(tǒng)右鍵菜單功能
2.綁定鼠標右鍵事件后,實際是觸發(fā)鼠標按下事件。
3.通過if來判斷,如果按下的是右鍵則執(zhí)行參數(shù),這個參數(shù)只能是函數(shù)。如果不是右鍵則不執(zhí)行。
相信講到這里,對jquery很熟悉的也明白要怎么做了。
jquery事件機制擴展,jquery鼠標右鍵事件。
復制代碼 代碼如下:
/*鼠標右鍵插件*/
(function($) {
$.fn.extend({
//定義鼠標右鍵方法,接收一個函數(shù)參數(shù)
"rightClick":function(fn){
//調用這個方法后將禁止系統(tǒng)的右鍵菜單
$(document).bind('contextmenu',function(e){
return false;
});
//為這個對象綁定鼠標按下事件
$(this).mousedown(function(e){
//如果按下的是右鍵,則執(zhí)行函數(shù)
if(3 == e.which){
fn();
}
});
}
});
})(jQuery);
復制代碼 代碼如下:
$(document).ready(function(e){
$("body").rightClick(function()(alert("右鍵單擊")));
});
jquery事件機制擴展,jquery鼠標右鍵事件。
使用方法跟其它事件一樣
您可能感興趣的文章:
- JQuery右鍵菜單插件ContextMenu使用指南
- jQuery簡單實現(xiàn)禁用右鍵菜單
- jquery 簡短右鍵菜單 多瀏覽器兼容
- jQuery右鍵菜單contextMenu使用實例
- 深入探討JavaScript、JQuery屏蔽網(wǎng)頁鼠標右鍵菜單及禁止選擇復制
- 基于jQuery的動態(tài)增刪改查表格信息,可左鍵/右鍵提示(原創(chuàng)自Zjmainstay)
- jquery實現(xiàn)在網(wǎng)頁指定區(qū)域顯示自定義右鍵菜單效果
- jquery禁用右鍵單擊功能屏蔽F5刷新
- jQuery檢測鼠標左鍵和右鍵點擊的方法
- JQuery模擬實現(xiàn)網(wǎng)頁中自定義鼠標右鍵菜單功能
相關文章
使用jQuery的easydrag插件實現(xiàn)可拖動的DIV彈出框
EasyDrag 是一個用來實現(xiàn)頁面元素拖拉的 jQuery 插件。接下來通過本文給大家介紹使用jQuery的easydrag插件實現(xiàn)可拖動的DIV彈出框,感興趣的朋友一起學習吧2016-02-02jQuery實現(xiàn)在HTML文檔加載完畢后自動執(zhí)行某個事件的方法
這篇文章主要介紹了jQuery實現(xiàn)在HTML文檔加載完畢后自動執(zhí)行某個事件的方法,結合實例形式分析了document的ready()事件自動加載執(zhí)行事件的相關操作技巧,需要的朋友可以參考下2017-05-05