模組:事件管理
事件繫結:
除了可以使用addeventlistener()方法監聽某個特定元素上的事件外, 也可以使用.on()方法實現批量元素的事件繫結。
.on(event,select,handler);//event: type:string,需要監聽的事件名稱,例如:"tap";
//select:type:string,選擇器
//handler:type:function()事件觸發時的**函式,通過**中的event引數可以獲得事件詳情
示例:
mui(".mui-table-view").on('tap','.mui-table-view-cell',function());
//開啟新聞詳情
mui.openwindow();
})
事件取消:
使用on()方法繫結事件後,若希望取消繫結,則可以使用off()方法。 off()方法根據傳入引數的不同,有不同的實現邏輯。
.off(event,select,handler);.off(event,select);
.off(event);
.off();
//空引數,刪除該元素上所有事件
//event: type:string,需取消繫結的事件名稱,例如:'tap';
//select:type:string,選擇器
//handler:type:function()之前繫結到該元素上的事件函式,不支援匿名函式
具體示例:
事件觸發:
使用mui.trigger()方法可以動態觸發特定dom元素上的事件。
示例:自動觸發按鈕的點選事件
var btn = document.getelementbyid("submit");//監聽點選事件
btn.addeventlistener("tap",function
() );
//觸發submit按鈕的點選事件
mui.trigger(btn,'tap');
手勢事件:
在開發移動端的應用時,會用到很多的手勢操作,比如滑動、長按等,為了方便開放者快速整合這些手勢,mui內建了常用的手勢事件,目前支援的手勢事件見如下列表:
分類引數
描述點選
tap單擊螢幕
doubletap
雙擊螢幕
長按longtap
長按螢幕
hold
按住螢幕
release
離開螢幕
滑動swipeleft
向左滑動
swiperight
向右滑動
swipeup
向上滑動
swipedown
向下滑動
拖動dragstart
開始拖動
drag
拖動中dragend
拖動結束
手勢事件配置:
mui.init(});
注意:dragstart、drag、dragend共用drag開關,swipeleft、swiperight、swipeup、swipedown共用swipe開關
事件監聽:
單個元素上的事件監聽,直接使用addeventlistener()即可,如下:
elem.addeventlistener("swipeleft",function());
若多個元素執行相同邏輯,則建議使用事件繫結(on()) ;
mui和zepto的tap事件
zepto.js和mui一起使用的時候,tap事件會發生兩次,這時只要不引用zepto.js的touch.js就可以了,只用mui的tap事件 b5教程網 1.zepto.js和mui一起使用的時候,tap事件會發生兩次,這時只要不引用zepto.js的touch.js就可以了,只用mui的tap事...
mui自定義事件例項
新增自定義事件監聽操作和標準js事件監聽類似,可直接通過window物件新增,如下 window.addeventlistener customevent function event 觸發自定義事件 傳參頁面應用 通過mui.fire 方法可觸發目標視窗的自定義事件 引數target type w...
MUI自定義事件傳參
在mui中頁面之間的傳參一般是分為兩種的,一種是通過開啟頁面或者預載入頁面的時候傳遞引數,另一種就是自定義事件了,我們來說說自定義事件傳參的問題 我們來分兩種情況 一,頁面已經存在的時候 這種情況是很容易的,直接就是mui.fire 目標頁面,事件名稱,二,頁面是新建立的 如果你是這麼寫的話 var...