jQuery實現(xiàn)獲取綁定自定義事件元素的方法
更新時間:2015年12月02日 16:33:28 作者:lsjlnd
這篇文章主要介紹了jQuery實現(xiàn)獲取綁定自定義事件元素的方法,涉及jQuery方法重載、事件綁定及元素操作的相關技巧,具有一定參考借鑒價值,需要的朋友可以參考下
本文實例講述了jQuery實現(xiàn)獲取綁定自定義事件元素的方法。分享給大家供大家參考,具體如下:
(function ($) { // 自定義itemtab事件 $.fn.bind = function(types, data, fn) { // 重載jQuery.fn.bind方法,用來截獲綁定自定義事件的元素 if(typeof types == 'string' && 'itemtab' == types) { var itemTouchStart = -1; // touchstart位置 var itemTouchMove = -1; // touchend位置,值為-1時表示未觸發(fā) var itemTriggerDistance = 0; // 拖動距離閥值,若大于該值則為拖動列表,若小于等于該值則為點擊列表項 var itemMoved = false; // 列表是否為拖動狀態(tài) $(this).bind('touchstart', function (event) { if(!event.originalEvent.touches.length) return true; itemMoved = false; itemTouchStart = event.originalEvent.touches[0].pageX; // 記錄起始位置 }).bind('touchmove', function (event) { if(!event.originalEvent.touches.length) return true; itemTouchMove = event.originalEvent.touches[0].pageX; // 當前拖動位置 //console.log('touchmove:', itemTouchStart, itemTouchMove, itemMoved); if(Math.abs(itemTouchMove - itemTouchStart) > itemTriggerDistance) { itemMoved = true; // 列表被拖動 } }).bind('touchend', function (event) { //console.log('itemMoved:', itemMoved); if(itemMoved) { // 列表被拖動過,非點擊操作 return true; } $(this).trigger('itemtab'); // 觸發(fā)自定義事件 }); } return this.on( types, null, data, fn ); // 這種做法具有侵入性,多個類似的代碼會相互覆蓋,可采用深度復制方式調(diào)用原$.fn.bind方法 } })(jQuery);
希望本文所述對大家jQuery程序設計有所幫助。
相關文章
easyui取消表單實時驗證,提交時統(tǒng)一驗證的簡單實例
下面小編就為大家?guī)硪黄猠asyui取消表單實時驗證,提交時統(tǒng)一驗證的簡單實例。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-11-11Jquery遍歷checkbox獲取選中項value值的方法
這篇文章主要介紹了Jquery遍歷checkbox獲取選中項的value值,需要的朋友可以參考下2014-02-02PHP+MySQL+jQuery隨意拖動層并即時保存拖動位置實例講解
這篇文章主要介紹了PHP+MySQL+jQuery隨意拖動層并即時保存拖動位置的實現(xiàn)方法,感興趣的小伙伴們可以參考一下2015-10-10