Jquery Mobile 中綁定事件

發布時間：2020-06-25 15:42:10 來源：網絡閱讀：797 作者：15235125653 欄目：web開發

今天遇到了jmobile中綁定事件的問題,

參考:http://liyunpeng.iteye.com/blog/1964165

對頁面中的綁定事件有了大概了解,不過這篇帖子年代久遠,很多不是很詳細,特此記錄.

首先查到jmobile中的所有可以用.on()動態綁定的所有事件,

詳情參考:http://www.runoob.com/jquerymobile/jquerymobile-ref-events.html

按以前的理解照抄,結果死活出不來效果,認真查看示例發現需要加"pageinit"事件

$(document).on("pageinit","#pageone",function(){
$("p").on("tap",function(){
$(this).hide();
});
});

大概解釋一下這幾句代碼,on的使用方式和jqeury一樣,中間的參數是子集選擇器,和jquery不一樣的是,單擊事件名字成了tap(敲擊),還有個vclick(虛擬化的 click 事件處理器),親測這2個事件效果是一樣,還有如下

scrollstart	當用戶開始滾動頁面時觸發。
scrollstop	當用戶停止滾動頁面時觸發。
swipe	當用戶在元素上水平滑動時觸發。
swipeleft	當用戶從左劃過元素超過 30px 時觸發。
swiperight	當用戶從右劃過元素超過 30px 時觸發。
tap	當用戶敲擊某元素時觸發。
taphold	當元素敲擊某元素并保持一秒時觸發。
throttledresize	啟用可標記 #hash 歷史記錄
updatelayout	由動態顯示/隱藏內容的 jQuery Mobile 組件觸發。
vclick	虛擬化的 click 事件處理器
vmousecancel	虛擬化的 mousecancel 事件處理器
vmousedown	虛擬化的 mousedown 事件處理器
vmousemove	虛擬化的 mousemove 事件處理器
vmouseout	虛擬化的 mouseout 事件處理器
vmouseover	虛擬化的 mouseover 事件處理器
vmouseup	虛擬化的 mouseup 事件處理器

現在好了,可以完成自己的想法了;可是問題又來了,在有些時候會發現單擊事件會觸發2次....繼續度娘,發現相同的情況好多,主要原因是頁面初始化事件么有解綁定,與on對應的是off事件

參考:http://bbs.csdn.net/topics/390499499 完美解決

$(document).on("pageinit","#pageone",function(){
$("p").on("tap",function(){
$(this).hide();
});
}).on("pageinit", "#page2", initPage2);

function initPage2(event) {

$(document).off('pageinit', '#page2', initPage2);

//在第二個頁面需要綁定的事件代碼

alert("page2 init" + event.target.baseURI);

};

PS:在查閱相關文檔時發現個jmobile獨有的選擇器:jqmData,可以這樣用

alert( $(":jqmData(role='content')").length)

最后一句,充分說明:我們不生產代碼,只是谷歌(被墻以后現在是度娘)的搬運工~~

向AI問一下細節

亚洲激情专区-91九色丨porny丨老师-久久久久久久女国产乱让韩-国产精品午夜小视频观看