Blend UI 自定義事件 API
2018-10-17 11:34 更新
on ( event_type, callback ) 
自定義事件，為一個事件綁定回調函數，同一事件可綁定多個回調函數。
Blend.ui.on(event_type,callback);| 參數 | 類型 | 說明 | 是否必須 |
|---|---|---|---|
| event_type | String | 事件名稱 | 是 |
| callback | Function | 事件綁定的回調函數fuction(event): event['detail']為layer的id, event['data']為通過fire方法傳遞過來的數據 | 是 |
可用的系統事件名稱
| 事件名稱 | 說明 |
|---|---|
| layerCreateSuccess | layer創(chuàng)建成功 |
| layerLoadFinish | layer頁面載入成功 |
| layerPullDown | 下拉刷新loading |
| layerPoped | layer返回事件 |
| tap | slider點擊 |
| slide | slider滑動切換 |
| menuPressed | 菜單建事件 |
| layerGoBack | layer中返回鍵goBack回調 |
| backPressedBeforeExit | 返回鍵退出事件回調 |
實例
document.addEventListener("blendready",function() {
var callbackA = function(e){
console.log(e['data']);
};
var callbackB = function(e){
console.log(e['detail']);
};
//注冊事件
//如果是自定義的消息類型，則需要自行觸發(fā)
Blend.ui.on("event",callbackA};
Blend.ui.on("event",callbackB};
Blend.ui.fire("event","false");
//如果為系統事件，可以由系統觸發(fā)
//如下為按下android返回鍵時的處理操作
Blend.ui.on("backPressedBeforeExit",function(){
console.log("back event");
});
});off ( event_type, [callback] )
解綁事件，解綁event_type類型的函數回調。Blend.ui.on(event_type,[callback]);| 參數 | 類型 | 說明 | 是否必須 |
|---|---|---|---|
| event_type | String | 事件名稱 | 是 |
| callback | Function | 要解綁的函數，如果callback為空或"all"，將會刪除所有與event_type綁定的回調函數 | 否 |
實例
document.addEventListener("blendready",function(){
var callbackA = function(e){console.log(e)};
var callbackB = function(e){console.log(e)};
Blend.ui.on("event",callbackA};
Blend.ui.on("event",callbackB};
//解綁callbackA
Blend.ui.off("event",callbackA);
//解除與event相關的所有綁定
Blend.ui.off("event");
//Blend.ui.off("event","all");
});fire (event_type, targetId, message) 
觸發(fā)注冊的事件Blend.ui.fire(type,targetId,message);| 參數 | 類型 | 說明 | 是否必須 |
|---|---|---|---|
| event_type | String | 事件名稱 | 是 |
| targetId | String | 發(fā)送目標的layerId, 如果是false則是廣播，如果為“0”則表示向首頁發(fā)送（通常為index.html） | 是 |
| message | Object/String | 發(fā)送的數據信息可以是字符串或者json數據 | 否 |
實例
document.addEventListener("blendready",function(){
//自定義事件
var callback = function(e){console.log(e)};
Blend.ui.on("event",callback};
Blend.ui.fire("event","0",{"url":"http://www.baidu.com"});
});once ( event_type, callback ) 
注冊自定義事件，該自定義事件將在觸發(fā)后自動注銷，只能執(zhí)行一次Blend.ui.once(event_type, callback);| 參數 | 類型 | 說明 | 是否必須 |
|---|---|---|---|
| event_type | String | 事件名稱 | 是 |
| callback | Function | 事件綁定的回調函數fuction(event): event['detail']為layer的id, event['data']為通過fire方法傳遞過來的數據 | 是 |
實例
document.addEventListener("blendready",function() {
var callback = function(e){console.log(e)};
//注冊事件
Blend.ui.once("event",callback};
//觸發(fā)一次事件
Blend.ui.fire("event","false");
//二次觸發(fā)無效，事件已注銷
//Blend.ui.fire("event","false");
});layerInit ( layerId, callback )
在layerId對應的頁面初始化后的執(zhí)行函數Blend.ui.layerInit(layerId, callback);| 參數 | 類型 | 說明 | 是否必須 |
|---|---|---|---|
| layerId | String | layer的id；當layerId為"0"時表示首頁初始化后執(zhí)行callback函數，其它頁面的id由用戶自行定義 | 是 |
| callback | Function | 在相應layer初始化后執(zhí)行的函數 | 是 |
實例
document.addEventListener("blendready",function() {
//定義頁面id為test的layer初始化后執(zhí)行的callback
var callback = function(e){console.log("test layer ok")};
Blend.ui.layerInit("test", callback);
//創(chuàng)建layer并顯示
var layer = new Blend.ui.Layer({
"url":"content.html",
"id":"test",
"active":true
});
});以上內容是否對您有幫助：
更多建議：