本文介绍其它特性的JSAPI,供您在通过跨平台DevOps创建H5端应用或者小程序时参考。
页面加载完毕事件WindVaneReady
当页面加载完毕后,WindVane会引发WindVaneReady事件,页面可以监听这一事件,获取页面加载状态。页面刷新、页面历史记录回退同样都会触发这个事件。
document.addEventListener('WindVaneReady', function(e) {
alert('WindVaneReady');
}, false);
应用切换后台事件Background
当应用被切换到后台(如切换应用、打开通知栏等操作)时,WindVane会引发WV.Event.APP.Background事件,页面可以监听这一事件,获知应用已被切换到后台。
由于Android平台的限制,即使从当前WebView切换到其它Activity,也会引发WV.Event.APP.Background事件,而不仅仅是切换到后台时。
应用被切换到后台时能做的操作较少,可能会被延迟到页面重新激活时才执行。而且, 务必不要在该事件中弹alert,会导致一些Android机型出现严重BUG,打开任何页面都是空白。
WindVane iOS的5.6.0及更高版本,更新了Background事件的触发条件,保持与Android 的一致:从当前 WebView切换到其它Native或WebView时也会触发Background事件。
同时增加了一个事件参数to,用于区分从当前WebView切换到了何处,其取值为'background'
,表示从当前WebView切换到了后台。
如果to参数不存在,表示无法确定从当前WebView切换到了何处。
document.addEventListener('WV.Event.APP.Background', function(e) {
// 一些机型退出时弹 alert 会出问题。
console.log('Event Background');
}, false);
应用激活事件Active
当应用被切换到后台再切换回来时,WindVane会引发WV.Event.APP.Active事件,页面可以监听这一事件,获知应用已经被激活。
由于Android平台的限制,即使从其它Activity切换到当前WebView,也会引发WV.Event.APP.Active事件,而不仅仅是从后台切换到前台时。
WindVane iOS的5.6.0及更高版本,更新了Active事件的触发条件,保持与Android的一致:从其它Native或 WebView切换到当前WebView时也会触发Active事件。
同时增加了一个事件参数from,用于区分从何处切换到当前WebView,其可能的值为:
'background'
:表示从后台切换到了当前WebView。'webview'
:表示从其它WebView切换到了当前WebView。
如果from参数不存在,表示无法确定从何处切换到当前WebView。
VER.WindVane 6.3.0及更高版本,添加了一个data参数,用来获取从WebAppInterface.pop
中传递的数据。
document.addEventListener('WV.Event.APP.Active', function(e) {
alert('Event Active');
}, false);
下拉刷新Pull Refresh
该API仅适用于WindVane iOS。
WindVane iOS在默认情况下,会自动启用下拉刷新。要禁止下拉刷新,请将以下元数据添加到HTML的HEAD中:
<meta id="stopUsePullRefresh" value="true">
在下拉刷新的提示部分,可以选择是否显示当前页面的域名。要显示当前域名,请将以下元数据添加到HTML的 HEAD中:
<meta id="urlInLaw" value="true">
无限滚动Infinite Scroll
该API仅适用于WindVane iOS。
当页面滚动到最下方,可以通过无限滚动来动态的加载新内容。要启用无限滚动,请将以下元数据添加到HTML的 HEAD中:
<meta id="infiniteScroll" value="true">
在WindVane iOS中,请将以下元数据也添加到HEAD中:
<meta id="urlInLaw" value="true">
urlInLaw的value请根据需要设置,此处必须添加urlInLaw
,是WindVane iOS遗留的BUG。
添加了元数据后,就可以收到无限滚动的事件WV_INFINIT_SCROLL,在该事件中可以动态的获取新内容,并添加到页面的末尾。新内容获取到之后,需要调用WVScrollWidget.hiddenInfinitScroll这一 API隐藏无限滚动时的加载提示。
document.addEventListener('WV_INFINIT_SCROLL', function(e) {
var data = 'New document element for infinit scroll';
window.WindVane.call('WVScrollWidget', 'hiddenInfinitScroll', {}, function(e) {
var newDiv = document.createElement('div');
newDiv.innerHTML = data;
document.body.appendChild(newDiv);
});
}, false);