zoukankan      html  css  js  c++  java
  • HTML5+规范:Webview的使用详解

    一、知识点

      Webview模块管理应用窗口界面,实现多窗口的逻辑控制管理操作。通过plus.webview可获取应用界面管理对象。

    1、方法

    1.1、all: 获取所有Webview窗口

        Array[WebviewObject] plus.webview.all();

    说明:获取应用中已创建的所有Webview窗口,包括所有未显示的Webview窗口。 返回WebviewObject对象在数组中按创建的先后顺序排列,即数组中第一个WebviewObject对象用是加载应用的入口页面。

    返回值:Array[ WebviewObject] : 应用中创建的所有Webview窗口对象数组。

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. // 获取所有Webview窗口  
    10. var wvs=plus.webview.all();  
    11. for(var i=0;i<wvs.length;i++){  
    12. console.log("webview"+i+": "+wvs[i].getURL());  
    13. }  
    14. }  
    15. if(window.plus){  
    16. plusReady();  
    17. }else{  
    18. document.addEventListener("plusready",plusReady,false);  
    19. }  
    20. </script>  
    21. </head>  
    22. <body>  
    23. 获取所有Webview窗口  
    24. </body>  
    25. </html>  

     

    1.2、close: 关闭Webview窗口

        void plus.webview.close( id_wvobj, aniClose, duration, extras );

    说明:关闭已经打开的Webview窗口,需先获取窗口对象或窗口id,并可指定关闭窗口的动画及动画持续时间。

    参数:

    id_wvobj: ( String | WebviewObject ) 必选 要关闭Webview窗口id或窗口对象。若操作窗口对象已经关闭,则无任何效果。 使用窗口id时,则查找对应id的窗口,如果有多个相同id的窗口则操作最先打开的窗口,若没有查找到对应id的WebviewObject对象,则无任何效果。

    aniClose: ( AnimationTypeClose ) 可选 关闭Webview窗口的动画效果。如果没有指定关闭窗口动画,则使用默认值“auto”,即使用显示时设置的窗口动画相对应的关闭动画。

    duration: ( Number ) 可选 关闭Webview窗口动画的持续时间。单位为ms,如果没有设置则使用显示窗口动画时间。

    extras: ( WebviewExtraOptions) 可选 关闭Webview窗口扩展参数。可用于指定Webview窗口动画是否使用图片加速。

    返回值:void : 无

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. }  
    10. if(window.plus){  
    11. plusReady();  
    12. }else{  
    13. document.addEventListener("plusready",plusReady,false);  
    14. }  
    15. // 关闭自身窗口  
    16. function closeme(){  
    17. var ws=plus.webview.currentWebview();  
    18. plus.webview.close(ws);  
    19. }  
    20. </script>  
    21. </head>  
    22. <body>  
    23. 关闭Webview窗口<br/>  
    24. <button onclick="closeme()">close</button>  
    25. </body>  
    26. </html>  

     

    1.3、create: 创建新的Webview窗口

         WebviewObject plus.webview.create( url, id, styles, extras );

    说明:创建Webview窗口,用于加载新的HTML页面,可通过styles设置Webview窗口的样式,创建完成后需要调用show方法才能将Webview窗口显示出来。

    参数:

    url: ( String ) 可选 新窗口加载的HTML页面地址。新打开Webview窗口要加载的HTML页面地址,可支持本地地址和网络地址。

    id: ( String ) 可选 新窗口的标识。窗口标识可用于在其它页面中通过getWebviewById来查找指定的窗口,为了保持窗口标识的唯一性,应该避免使用相同的标识来创建多个Webview窗口。 如果传入无效的字符串则使用url参数作为WebviewObject窗口的id值。

    styles: ( WebviewStyles) 可选 创建Webview窗口的样式(如窗口宽、高、位置等信息)

    extras: ( JSON ) 可选 创建Webview窗口的额外扩展参数。值为JSON类型,设置扩展参数后可以直接通过Webview的点(“.”)操作符获取扩展参数属性值,如: var w=plus.webview.create('url.html','id',{},{preload:"preload webview"}); // 可直接通过以下方法获取preload值 console.log(w.preload); // 输出值为“preload webview”

    返回值:WebviewObject : Webview窗口对象

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. }  
    10. if(window.plus){  
    11. plusReady();  
    12. }else{  
    13. document.addEventListener("plusready",plusReady,false);  
    14. }  
    15. // 创建并显示新窗口  
    16. function create(){  
    17. var w = plus.webview.create( "http://weibo.com/dhnetwork" );  
    18. w.show(); // 显示窗口  
    19. }  
    20. </script>  
    21. </head>  
    22. <body>  
    23. 创建新的Webview窗口<br/>  
    24. <button onclick="create()">Create</button>  
    25. </body>  
    26. </html>  



     

    1.4、currentWebview: 获取当前窗口的WebviewObject对象

          WebviewObject plus.webview.currentWebview();

    说明:获取当前页面所属的Webview窗口对象。

    返回值:WebviewObject : Webview窗口对象

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. var ws=plus.webview.currentWebview();  
    10. console.log( "当前Webview窗口:"+ws.getURL() );  
    11. }  
    12. if(window.plus){  
    13. plusReady();  
    14. }else{  
    15. document.addEventListener("plusready",plusReady,false);  
    16. }  
    17. </script>  
    18. </head>  
    19. <body>  
    20. 获取自身Webview窗口  
    21. </body>  
    22. </html>  

     

    1.5、getWebviewById: 查找指定标识的WebviewObject窗口

          WebviewObject plus.webview.getWebviewById( id );

    说明:在已创建的窗口列表中查找指定标识的Webview窗口并返回。 若没有查找到指定标识的窗口则返回null,若存在多个相同标识的Webview窗口,则返回第一个创建的Webview窗口。 如果要获取应用入口页面所属的Webview窗口,其标识为应用的%APPID%,可通过plus.runtime.appid获取。

    参数:id: ( String ) 必选 要查找的Webview窗口标识

    返回值:WebviewObject : WebviewObject窗口对象

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. // 查找应用首页窗口对象  
    10. var h=plus.webview.getWebviewById( plus.runtime.appid );  
    11. console.log( "应用首页Webview窗口:"+h.getURL() );  
    12. }  
    13. if(window.plus){  
    14. plusReady();  
    15. }else{  
    16. document.addEventListener("plusready",plusReady,false);  
    17. }  
    18. </script>  
    19. </head>  
    20. <body>  
    21. 查找指定标识的窗口  
    22. </body>  
    23. </html>  

     

    1.6、getLaunchWebview: 获取应用首页WebviewObject窗口对象

           WebviewObject plus.webview.getLaunchWebview();

    返回值:WebviewObject : WebviewObject窗口对象

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. // 获取应用首页窗口对象  
    10. var h=plus.webview.getLaunchWebview();  
    11. console.log( "应用首页Webview窗口:"+h.getURL() );  
    12. }  
    13. if(window.plus){  
    14. plusReady();  
    15. }else{  
    16. document.addEventListener("plusready",plusReady,false);  
    17. }  
    18. </script>  
    19. </head>  
    20. <body>  
    21. 获取应用首页WebviewObject窗口对象  
    22. </body>  
    23. </html>  

     

    1.7、getTopWebview: 获取应用显示栈顶的WebviewObject窗口对象

        WebviewObject plus.webview.getTopWebview();

    返回值:WebviewObject : WebviewObject窗口对象

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. // 获取应用首页窗口对象  
    10. var h=plus.webview.getTopWebview();  
    11. console.log( "应用显示栈顶的Webview窗口:"+h.getURL() );  
    12. }  
    13. if(window.plus){  
    14. plusReady();  
    15. }else{  
    16. document.addEventListener("plusready",plusReady,false);  
    17. }  
    18. </script>  
    19. </head>  
    20. <body>  
    21. 获取应用显示栈顶的WebviewObject窗口对象  
    22. </body>  
    23. </html>  



     

    1.8、hide: 隐藏Webview窗口

          void plus.webview.hide( id_wvobj, aniHide, duration, extras );

    说明:根据指定的WebviewObject对象或id隐藏Webview窗口,使得窗口不可见。

    参数:

    id_wvobj: ( String | WebviewObject ) 必选 要隐藏的Webview窗口id或窗口对象。使用窗口对象时,若窗口对象已经隐藏,则无任何效果。 使用窗口id时,则查找对应id的窗口,如果有多个相同id的窗口则操作最先打开的,若没有查找到对应id的WebviewObject对象,则无任何效果。

    aniHide: ( AnimationTypeClose) 可选 隐藏Webview窗口的动画效果。如果没有指定窗口动画,则使用默认动画效果“none”。

    duration: ( Number ) 可选 隐藏Webview窗口动画的持续时间。单位为ms,如果没有设置则使用默认窗口动画时间。

    extras: ( WebviewExtraOptions) 可选 隐藏Webview窗口扩展参数。可用于指定Webview窗口动画是否使用图片加速。

    返回值:void : 无

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. }  
    10. if(window.plus){  
    11. plusReady();  
    12. }else{  
    13. document.addEventListener("plusready",plusReady,false);  
    14. }  
    15. // 隐藏自身窗口  
    16. function hideeme(){  
    17. plus.webview.hide( plus.webview.currentWebview() );  
    18. }  
    19. </script>  
    20. </head>  
    21. <body>  
    22. 隐藏Webview窗口<br/>  
    23. <button onclick="hideeme()">Hide</button>  
    24. </body>  
    25. </html>  



     

    1.9、open: 创建并打开Webview窗口

             WebviewObject plus.webview.open( url, id, styles, aniShow, duration, showedCB );

    说明:创建并显示Webview窗口,用于加载新的HTML页面,可通过styles设置Webview窗口的样式,创建完成后自动将Webview窗口显示出来。

    参数:

    url: ( String ) 可选 打开窗口加载的HTML页面地址。新打开Webview窗口要加载的HTML页面地址,可支持本地地址和网络地址。

    id: ( String ) 可选 打开窗口的标识。窗口标识可用于在其它页面中通过getWebviewById来查找指定的窗口,为了保持窗口标识的唯一性,应该避免使用相同的标识来创建多个Webview窗口。 如果传入无效的字符串则使用url参数作为WebviewObject窗口的id值。

    styles: ( WebviewStyles) 可选 创建Webview窗口的样式(如窗口宽、高、位置等信息)

    aniShow: ( AnimationTypeShow) 可选 显示Webview窗口的动画效果。如果没有指定窗口动画,则使用默认无动画效果“none”。

    duration: ( Number ) 可选 显示Webview窗口动画的持续时间。单位为ms,如果没有设置则使用默认窗口动画时间600ms。

    showedCB: ( SuccessCallback ) 可选 Webview窗口显示完成的回调函数。当指定Webview窗口显示动画执行完毕时触发回调函数,窗口无动画效果(如"none"动画效果)时也会触发此回调。

    返回值:WebviewObject : WebviewObject窗口对象

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. }  
    10. if(window.plus){  
    11. plusReady();  
    12. }else{  
    13. document.addEventListener("plusready",plusReady,false);  
    14. }  
    15. // 创建并显示新窗口  
    16. function openWebview(){  
    17. var w = plus.webview.open( "http://weibo.com/dhnetwork" );  
    18. }  
    19. </script>  
    20. </head>  
    21. <body>  
    22. 打开Webview窗口<br/>  
    23. <button onclick="openWebview()">Open</button>  
    24. </body>  
    25. </html>  



     

    1.10、show: 显示Webview窗口

       void plus.webview.show( id_wvobj, aniShow, duration, showedCB, extras );

    说明:显示已创建或隐藏的Webview窗口,需先获取窗口对象或窗口id,并可指定显示窗口的动画及动画持续时间。

    参数:

    id_wvobj: ( String | WebviewObject ) 必选 要显示Webview窗口id或窗口对象。若操作Webview窗口对象显示,则无任何效果。 使用窗口id时,则查找对应id的窗口,如果有多个相同id的窗口则操作最先创建的窗口,若没有查找到对应id的WebviewObject对象,则无任何效果。

    aniShow: ( AnimationTypeShow) 可选 显示Webview窗口的动画效果。如果没有指定窗口动画类型,则使用默认值“auto”,即自动选择上一次显示窗口的动画效果,如果之前没有显示过,则使用“none”动画效果。

    duration: ( Number ) 可选 显示Webview窗口动画的持续时间。单位为ms,如果没有设置则使用默认窗口动画时间600ms。

    showedCB: ( SuccessCallback ) 可选 Webview窗口显示完成的回调函数。当指定Webview窗口显示动画执行完毕时触发回调函数,窗口无动画效果(如"none"动画效果)时也会触发此回调。

    extras: ( WebviewExtraOptions) 可选 显示Webview窗口扩展参数。可用于指定Webview窗口动画是否使用图片加速。

    返回值:WebviewObject : Webview窗口对象

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. }  
    10. if(window.plus){  
    11. plusReady();  
    12. }else{  
    13. document.addEventListener("plusready",plusReady,false);  
    14. }  
    15.    
    16. // 创建并显示新窗口  
    17. function create(){  
    18. var w = plus.webview.create( "http://weibo.com/dhnetwork" );  
    19. plus.webview.show( w ); // 显示窗口  
    20. }  
    21. </script>  
    22. </head>  
    23. <body>  
    24. 显示Webview窗口<br/>  
    25. <button onclick="create()">Create</button>  
    26. </body>  
    27. </html>  

     

     

    1.11、defaultHardwareAccelerated: 获取Webview默认是否开启硬件加速

            Boolean plus.webview.defaultHardwareAccelerated();

    说明:由于不同设备对硬件加速的支持情况存在差异,开启硬件加速能加速HTML页面的渲染,但也会消耗更多的系统资源,从而导致在部分设备上可能出现闪屏、发虚、分块渲染等问题, 因此5+ Runtime会根据设备实际支持情况自动选择是否开启硬件加速。 关闭硬件加速则可能会导致Webview页面无法支持Video标签播放视频等问题,如果在特定情况下需要调整修改默认开启硬件加速的行为,则可通过plus.webview.defaultHardwareAccelerated()方法获取当前设备默认是否开启硬件加速状态,从而决定是否需要显式开启或关闭指定Webview的硬件加速功能(通过WebviewStyles的hardwareAccelerated属性设置)。

    返回值:Boolean : Webview窗口默认开启硬件加速则返回true,否则返回false。

    平台支持:Android - 2.3+ (支持): 返回当前设备默认是否开启硬件加速。iOS - 5.1+ (不支持): 返回固定值true。

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. }  
    10. if(window.plus){  
    11. plusReady();  
    12. }else{  
    13. document.addEventListener("plusready",plusReady,false);  
    14. }  
    15.    
    16. // 创建新窗口并设置开启硬件加速  
    17. function create(){  
    18. var styles={};  
    19. // 在Android5以上设备,如果默认没有开启硬件加速,则强制设置开启  
    20. if(!plus.webview.defaultHardwareAccelerated()&&parseInt(plus.os.version)>=5){  
    21. styles.hardwareAccelerated=true;  
    22. }  
    23. var w = plus.webview.create( "http://weibo.com/dhnetwork", "test", styles );  
    24. plus.webview.show( w ); // 显示窗口  
    25. }  
    26. </script>  
    27. </head>  
    28. <body>  
    29. 开启硬件加速显示Webview窗口<br/>  
    30. <button onclick="create()">Create</button>  
    31. </body>  
    32. </html>  



     

    2、对象

    AnimationTypeShow: 一组用于定义页面或控件显示动画效果

    AnimationTypeClose: 一组用于定义页面或控件关闭的动画效果

    WebviewObject: Webview窗口对象,用于操作加载HTML页面的窗口

    WebviewBounceStyle: Webview窗口回弹样式

    WebviewDock: 原生控件在窗口中停靠的方式

    WebviewEvent: Webview窗口事件

    WebviewRefreshStyle: Webview窗口下拉刷新样式

    WebviewPosition: 原生控件在窗口中显示的位置

    WebviewStyles: JSON对象,原生窗口设置参数的对象

    WebviewExtraOptions: JSON对象,原生窗口扩展参数

    WebviewTransform: 一组用于定义页面或控件变形的属性

    WebviewTransition: 一组用于定义页面或控件转换效果的属性

    WebviewOverrideUrlOptions: 拦截Webview窗口URL请求的属性

    3、回调方法

    BounceEventCallback: Webview窗口回弹事件的回调函数

    EventCallback: Webview窗口事件的回调函数

    PopGestureCallback: Webview窗口侧滑事件的回调函数

    HistoryQueryCallback: 历史记录记录查询的回调函数

    OverrideUrlLoadingCallback: Webview窗口拦截URL链接跳转的回调函数

    TitleUpdateCallback: Webview窗口加载页面标题更新的回调函数

    SuccessCallback: Webview窗口操作成功回调函数

    ErrorCallback: Webview窗口操作失败回调函数

     

    二、重点

    1、 在Webview窗口中添加子窗口

     

    [html] view plain copy
     
    1. embed=plus.webview.create("http://weibo.com/dhnetwork","",{top:"46px",bottom:"0px"});  
    2. plus.webview.currentWebview().append( embed );  
    3. 与下面使用show显示Webview窗口效果一样。  
    4. ws=plus.webview.currentWebview();  
    5. embed=plus.webview.create("http://weibo.com/dhnetwork","",{top:"46px",bottom:"0px"});  
    6. embed.show();  

     

    2、appendJsFile和setJsFile

    (1)、wobj.appendJsFile( file ):添加Webview窗口预加载js文件

        对于一些网络HTML页面,在无法修改HTML页面时可通过此方法自动加载本地js文件。 当Webview窗口跳转到新页面时也会自动加载指定的js执行,添加多个js文件将按照添加的先后顺序执行。

     

    [html] view plain copy
     
    1. var nw=plus.webview.create("http://weibo.com/dhnetwork");  
    2. nw.appendJsFile("_www/preload.js");  
    3. nw.show();  

     

    (2)、void wobj.setJsFile( path ):设置预加载的JS文件

        预加载JS文件不需要在HTML页面中显式引用,在Webview窗口加载HTML页面时自动加载,在页面跳转时也会自动加载。 设置新的JS文件后将清空之前设置的值。

     

    [html] view plain copy
     
    1. ws=plus.webview.currentWebview();  
    2. embed=plus.webview.create("http://weibo.com/dhnetwork");  
    3. embed.setJsFile( "_www/js/preload.js" );  
    4. ws.append(embed);  



     

    3、clear:、hide和close

    (1)、clear: 清空原生Webview窗口加载的内容

               void wobj.clear();

     

    说明:清除原生窗口的内容,用于重置原生窗口加载的内容,清除其加载的历史记录等内容。

     

    [html] view plain copy
     
    1. embed=plus.webview.create("http://weibo.com/dhnetwork","",{top:"46px",bottom:"0px"});  
    2. plus.webview.currentWebview().append( embed );  
    3. embed.clear();  

     

    (2)、hide: 隐藏Webview窗口

          void plus.webview.hide( id_wvobj, aniHide, duration, extras );

    说明:根据指定的WebviewObject对象或id隐藏Webview窗口,使得窗口不可见。

         plus.webview.hide( plus.webview.currentWebview() );

    (3)、hide: 隐藏Webview窗口

             void wobj.hide( aniHide, duration, extras );

    说明:隐藏Webview窗口可保存已加载HTML页面的上下文数据,能降低应用使用的系统资源,通过show方法可将隐藏的Webview窗口显示出来。

     

    [html] view plain copy
     
    1. ws=plus.webview.currentWebview();  
    2. embed=plus.webview.create("http://weibo.com/dhnetwork","",{top:"46px",bottom:"0px"});  
    3. embed.show();  
    4. embed.hide();  

     

    (4)、close: 关闭Webview窗口

          void plus.webview.close( id_wvobj, aniClose, duration, extras );

    说明:关闭已经打开的Webview窗口,需先获取窗口对象或窗口id,并可指定关闭窗口的动画及动画持续时间。

     

    [html] view plain copy
     
    1. var ws=plus.webview.currentWebview();  
    2. plus.webview.close(ws);  

     

    (5)、close: 关闭Webview窗口

           void wobj.close( aniClose, duration, extras );

    说明:关闭并销毁Webview窗口,可设置关闭动画和动画持续时间。

     

    [html] view plain copy
     
    1. ws=plus.webview.currentWebview();  
    2. ws.close();  

     

    4、setPullToRefresh:设置Webview窗口的下拉刷新效果

           void wobj.setPullToRefresh( style, refreshCB );

     

    说明:开启Webview窗口的下拉刷新功能,显示窗口内置的下拉刷新控件样式。

    参数:

    style: ( WebviewRefreshStyle) 必选 Webview窗口下拉刷新样式参数。可设置窗口内置的下拉刷新控件在各种状态显示的文字内容。

    refreshCB: ( SuccessCallback ) 必选 Webview窗口下拉刷新事件回调。用户操作窗口的下拉刷新触发窗口刷新事件时触发。

    返回值:void : 无

    平台支持:Android - 2.2+ (支持),iOS - ALL (支持)

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE HTML>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8"/>  
    5. <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>  
    6. <meta name="HandheldFriendly" content="true"/>  
    7. <meta name="MobileOptimized" content="320"/>  
    8. <title>Webview Example</title>  
    9. <script type="text/javascript" charset="utf-8">  
    10. var ws=null;var list=null;  
    11. // 扩展API加载完毕,现在可以正常调用扩展API  
    12. function plusReady(){  
    13. ws=plus.webview.currentWebview();  
    14. ws.setPullToRefresh({support:true,  
    15. height:"50px",  
    16. range:"200px",  
    17. contentdown:{  
    18. caption:"下拉可以刷新"  
    19. },  
    20. contentover:{  
    21. caption:"释放立即刷新"  
    22. },  
    23. contentrefresh:{  
    24. caption:"正在刷新..."  
    25. }  
    26. },onRefresh);  
    27. plus.nativeUI.toast("下拉可以刷新");  
    28. }  
    29. // 判断扩展API是否准备,否则监听"plusready"事件  
    30. if(window.plus){  
    31. plusReady();  
    32. }else{  
    33. document.addEventListener("plusready",plusReady,false);  
    34. }  
    35. // DOM构建完成获取列表元素  
    36. document.addEventListener("DOMContentLoaded",function(){  
    37. list=document.getElementById("list");  
    38. })  
    39. // 刷新页面  
    40. function onRefresh(){  
    41. setTimeout(function(){  
    42. if(list){  
    43. var item=document.createElement("li");  
    44. item.innerHTML="<span>New Item "+(new Date())+"</span>";  
    45. list.insertBefore(item,list.firstChild);  
    46. }  
    47. ws.endPullToRefresh();  
    48. },2000);  
    49. }  
    50. </script>  
    51. <link rel="stylesheet" href="../css/common.css" type="text/css" charset="utf-8"/>  
    52. <style type="text/css">  
    53. li {  
    54. padding: 1em;  
    55. border-bottom: 1px solid #eaeaea;  
    56. }  
    57. li:active {  
    58. background: #f4f4f4;  
    59. }  
    60. </style>  
    61. </head>  
    62. <body>  
    63. <ul id="list" style="list-style:none;margin:0;padding:0;">  
    64. <li><span>Initializ List Item 1</span></li>  
    65. <li><span>Initializ List Item 2</span></li>  
    66. <li><span>Initializ List Item 3</span></li>  
    67. <li><span>Initializ List Item 4</span></li>  
    68. <li><span>Initializ List Item 5</span></li>  
    69. <li><span>Initializ List Item 6</span></li>  
    70. <li><span>Initializ List Item 7</span></li>  
    71. <li><span>Initializ List Item 8</span></li>  
    72. <li><span>Initializ List Item 9</span></li>  
    73. <li><span>Initializ List Item 10</span></li>  
    74. </ul>  
    75. </body>  
    76. </html>  



     

    5、setStyle:设置Webview窗口的样式

            void wobj.setStyle( styles );

    说明:更新Webview窗口的样式,如窗口位置、大小、背景色等。

    参数:styles: ( WebviewStyles ) 必选 要设置的窗口样式

    返回值:void : 无

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. var ws=null,embed=null;  
    8. // H5 plus事件处理  
    9. function plusReady(){  
    10. ws=plus.webview.currentWebview();  
    11. embed=plus.webview.create("http://weibo.com/dhnetwork","",{top:"46px",bottom:"0px"});  
    12. ws.append(embed);  
    13. }  
    14. if(window.plus){  
    15. plusReady();  
    16. }else{  
    17. document.addEventListener("plusready",plusReady,false);  
    18. }  
    19. // 设置Webview窗口的样式  
    20. function updateStyle() {  
    21. embed.setStyle( {top:"92px"} );  
    22. }  
    23. </script>  
    24. </head>  
    25. <body>  
    26. 设置Webview窗口的样式  
    27. <button onclick="updateStyle()">setStyle</button>  
    28. </body>  
    29. </html>  



     

    6、setBounce:设置Webview窗口的回弹效果

            void wobj.setBounce( style );

    说明:开启窗口回弹效果后,当窗口中展现的内容滚动到头(顶部或底部)时,再拖拽时窗口整体内容将跟随移动,松开后自动回弹到停靠位置(可通过style设置)。 拖拽窗口内容时页面显示Webview窗口的背景色,默认为透明,此时显示Webview下面的内容,利用这个特点可以实现自定下拉刷新特效。

    参数:

    style: ( WebviewBounceStyle) 必选 Webview窗口回弹样式参数,可设置窗口的回弹效果支持的方向,自动回弹后停靠的位置等参数。

    返回值:void : 无

    平台支持:Android - 2.2+ (支持),iOS - ALL (不支持)

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. var ws=null;  
    8. // H5 plus事件处理  
    9. function plusReady(){  
    10. ws=plus.webview.currentWebview();  
    11. ws.setBounce({position:{top:"100px"},changeoffset:{top:"0px"}});  
    12. }  
    13. if(window.plus){  
    14. plusReady();  
    15. }else{  
    16. document.addEventListener("plusready",plusReady,false);  
    17. }  
    18. </script>  
    19. </head>  
    20. <body style="text-align:center;">  
    21. <br/><br/><br/>  
    22. 设置Webview窗口的回弹效果<br/><br/><br/>  
    23. *暂仅支持顶部的回弹效果*  
    24. </body>  
    25. </html>  



     

    7、setBlockNetworkImage:设置Webview窗口是否阻塞加载页面中使用的网络图片

          void wobj.setBlockNetworkImage( block );

     

    参数:block: ( Boolean ) 必选 是否阻塞加载网络图片。true表示不加载页面中使用的网络图片,false表示加载也页面中使用的网络图片。

    返回值:void : 无

    平台支持:Android - 2.2+ (支持),iOS - ALL (不支持)

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. var ws=null;  
    8. // H5 plus事件处理  
    9. function plusReady(){  
    10. }  
    11. if(window.plus){  
    12. plusReady();  
    13. }else{  
    14. document.addEventListener("plusready",plusReady,false);  
    15. }  
    16. function blockOpen(){  
    17. // 阻塞网络图片模式打开页面  
    18. var w=plus.webview.create("http://m.csdn.net/","csdn",{blockNetworkImage:true});  
    19. w.addEventListener("loaded",function(){  
    20. w.show("slide-in-right",300);  
    21. // 加载网络图片  
    22. w.setBlockNetworkImage(false);  
    23. },false);  
    24. }  
    25. </script>  
    26. </head>  
    27. <body>  
    28. 显示窗口后再加载网络图片<br/>  
    29. <button onclick="blockOpen()">打开页面</button>  
    30. </body>  
    31. </html>  



     

     

    8、addEventListener:添加事件监听器

            wobj.addEventListener( event, listener, capture );

    说明:向Webview窗口添加事件监听器,当指定的事件发生时,将触发listener函数的执行。 可多次调用此方法向Webview添加多个监听器,当监听的事件发生时,将按照添加的先后顺序执行。 

    参数:

    event: ( WebviewEvent ) 必选 Webview窗口事件类型

    listener: ( EventCallback ) 必选 监听事件发生时执行的回调函数

    capture: ( Boolean ) 可选 捕获事件流顺序,暂无效果

    返回值:void : 无

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. }  
    10. if(window.plus){  
    11. plusReady();  
    12. }else{  
    13. document.addEventListener("plusready",plusReady,false);  
    14. }  
    15. var nw=null;  
    16. // 监听Webview窗口事件  
    17. function eventTest() {  
    18. if(nw){return;}  
    19. var w=plus.nativeUI.showWaiting()  
    20. // 打开新窗口  
    21. nw=plus.webview.create( "http://weibo.com/dhnetwork" );  
    22. nw.addEventListener( "loaded", function(){  
    23. console.log( "New Window loaded!" );  
    24. nw.show(); // 显示窗口  
    25. w.close();  
    26. w=null;  
    27. }, false );  
    28. }  
    29. </script>  
    30. </head>  
    31. <body>  
    32. 添加事件监听器<br/>  
    33. <button onclick="eventTest()">Event Listener</button>  
    34. </body>  
    35. </html>  



     

    9、WebviewEvent:Webview窗口事件

       (1)、"close": (String 类型 )Webview窗口关闭事件。通过WebviewObject对象的addEventListener方法添加事件监听函数,当Webview窗口关闭时触发此事件,回调函数类型为EventCallback。

       (2)、"dragBounce": (String 类型 )Webview窗口回弹事件。通过WebviewObject对象的setBounce方法开启回弹效果设置顶部下拉回弹changeoffset属性后,当用户向下拖拽窗口时触发发此事件,回调函数类型为BounceEventCallback。

       (3)、"slideBounce": (String 类型 )Webview窗口回弹事件。通过WebviewObject对象的setBounce方法开启回弹效果设置左右侧侧滑slideoffset属性后,当用户向左右侧拖拽窗口侧滑时触发发此事件,回调函数类型为BounceEventCallback。

       (4)、"error": (String 类型 )Webview窗口加载错误事件。通过WebviewObject对象的addEventListener方法添加事件监听函数,当Webview窗口加载错误时触发此事件,回调函数类型为EventCallback。

       (5)、"hide": (String 类型 )Webview窗口隐藏事件。通过WebviewObject对象的addEventListener方法添加事件监听函数,当Webview窗口隐藏(窗口动画完成后)时触发此事件,回调函数类型为EventCallback。

       (6)、"loading": (String 类型 )Webview窗口页面开始加载事件。通过WebviewObject对象的addEventListener方法添加事件监听函数,当Webview窗口开始加载新页面时触发此事件,回调函数类型为EventCallback。

       (7)、"loaded": (String 类型 )Webview窗口页面加载完成事件。通过WebviewObject对象的addEventListener方法添加事件监听函数,当Webview窗口页面加载完成时触发此事件,回调函数类型为EventCallback。

       (8)、"maskClick": (String 类型 )Webview窗口显示遮罩层时点击事件。通过WebviewObject对象的addEventListener方法添加事件监听函数,当Webview窗口通过mask属性设置显示遮罩层并且点击时触发此事件,回调函数类型为EventCallback。

       (9)、"show": (String 类型 )Webview窗口显示事件。通过WebviewObject对象的addEventListener方法添加事件监听函数,当Webview窗口显示(窗口动画完成后)时触发此事件,回调函数类型为EventCallback。

       (10)、"popGesture": (String 类型 )Webview窗口侧滑返回事件。通过WebviewObject对象的addEventListener方法添加事件监听函数,当Webview窗口侧滑返回时触发此事件,回调函数类型为PopGestureCallback。

       (11)、"titleUpdate": (String 类型 )Webview加载页面标题更新事件。通过WebviewObject对象的addEventListener方法添加事件监听函数,当Webview窗口加载新页面更新标题时触发此事件,回调函数类型为SuccessCallback。 注意:此事件会先于loaded事件触发,通常在加载网络页面时通过此事件可更快获取到页面的标题。

    10、事件

    (1)、onclose: Webview窗口关闭事件

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. var ws=null,embed=null;  
    8. // H5 plus事件处理  
    9. function plusReady(){  
    10. ws=plus.webview.currentWebview();  
    11. embed=plus.webview.create("http://weibo.com/dhnetwork","",{top:"46px",bottom:"0px"});  
    12. embed.onclose=embedClose;  
    13. ws.append(embed);  
    14. }  
    15. if(window.plus){  
    16. plusReady();  
    17. }else{  
    18. document.addEventListener("plusready",plusReady,false);  
    19. }  
    20. // 页面关闭事件回调函数  
    21. function embedClose(e){  
    22. alert( "Closed!" );  
    23. }  
    24. </script>  
    25. </head>  
    26. <body>  
    27. Webview窗口关闭事件  
    28. <button onclick="embed.close()">onclose</button>  
    29. </body>  
    30. </html>  



     

    (2)、onerror: Webview窗口错误事件

    (3)、onloaded: Webview窗口页面加载完成事件

    (4)、onloading: Webview窗口页面开始加载事件

    一、知识点

      Webview模块管理应用窗口界面,实现多窗口的逻辑控制管理操作。通过plus.webview可获取应用界面管理对象。

    1、方法

    1.1、all: 获取所有Webview窗口

        Array[WebviewObject] plus.webview.all();

    说明:获取应用中已创建的所有Webview窗口,包括所有未显示的Webview窗口。 返回WebviewObject对象在数组中按创建的先后顺序排列,即数组中第一个WebviewObject对象用是加载应用的入口页面。

    返回值:Array[ WebviewObject] : 应用中创建的所有Webview窗口对象数组。

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. // 获取所有Webview窗口  
    10. var wvs=plus.webview.all();  
    11. for(var i=0;i<wvs.length;i++){  
    12. console.log("webview"+i+": "+wvs[i].getURL());  
    13. }  
    14. }  
    15. if(window.plus){  
    16. plusReady();  
    17. }else{  
    18. document.addEventListener("plusready",plusReady,false);  
    19. }  
    20. </script>  
    21. </head>  
    22. <body>  
    23. 获取所有Webview窗口  
    24. </body>  
    25. </html>  

     

    1.2、close: 关闭Webview窗口

        void plus.webview.close( id_wvobj, aniClose, duration, extras );

    说明:关闭已经打开的Webview窗口,需先获取窗口对象或窗口id,并可指定关闭窗口的动画及动画持续时间。

    参数:

    id_wvobj: ( String | WebviewObject ) 必选 要关闭Webview窗口id或窗口对象。若操作窗口对象已经关闭,则无任何效果。 使用窗口id时,则查找对应id的窗口,如果有多个相同id的窗口则操作最先打开的窗口,若没有查找到对应id的WebviewObject对象,则无任何效果。

    aniClose: ( AnimationTypeClose ) 可选 关闭Webview窗口的动画效果。如果没有指定关闭窗口动画,则使用默认值“auto”,即使用显示时设置的窗口动画相对应的关闭动画。

    duration: ( Number ) 可选 关闭Webview窗口动画的持续时间。单位为ms,如果没有设置则使用显示窗口动画时间。

    extras: ( WebviewExtraOptions) 可选 关闭Webview窗口扩展参数。可用于指定Webview窗口动画是否使用图片加速。

    返回值:void : 无

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. }  
    10. if(window.plus){  
    11. plusReady();  
    12. }else{  
    13. document.addEventListener("plusready",plusReady,false);  
    14. }  
    15. // 关闭自身窗口  
    16. function closeme(){  
    17. var ws=plus.webview.currentWebview();  
    18. plus.webview.close(ws);  
    19. }  
    20. </script>  
    21. </head>  
    22. <body>  
    23. 关闭Webview窗口<br/>  
    24. <button onclick="closeme()">close</button>  
    25. </body>  
    26. </html>  

     

    1.3、create: 创建新的Webview窗口

         WebviewObject plus.webview.create( url, id, styles, extras );

    说明:创建Webview窗口,用于加载新的HTML页面,可通过styles设置Webview窗口的样式,创建完成后需要调用show方法才能将Webview窗口显示出来。

    参数:

    url: ( String ) 可选 新窗口加载的HTML页面地址。新打开Webview窗口要加载的HTML页面地址,可支持本地地址和网络地址。

    id: ( String ) 可选 新窗口的标识。窗口标识可用于在其它页面中通过getWebviewById来查找指定的窗口,为了保持窗口标识的唯一性,应该避免使用相同的标识来创建多个Webview窗口。 如果传入无效的字符串则使用url参数作为WebviewObject窗口的id值。

    styles: ( WebviewStyles) 可选 创建Webview窗口的样式(如窗口宽、高、位置等信息)

    extras: ( JSON ) 可选 创建Webview窗口的额外扩展参数。值为JSON类型,设置扩展参数后可以直接通过Webview的点(“.”)操作符获取扩展参数属性值,如: var w=plus.webview.create('url.html','id',{},{preload:"preload webview"}); // 可直接通过以下方法获取preload值 console.log(w.preload); // 输出值为“preload webview”

    返回值:WebviewObject : Webview窗口对象

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. }  
    10. if(window.plus){  
    11. plusReady();  
    12. }else{  
    13. document.addEventListener("plusready",plusReady,false);  
    14. }  
    15. // 创建并显示新窗口  
    16. function create(){  
    17. var w = plus.webview.create( "http://weibo.com/dhnetwork" );  
    18. w.show(); // 显示窗口  
    19. }  
    20. </script>  
    21. </head>  
    22. <body>  
    23. 创建新的Webview窗口<br/>  
    24. <button onclick="create()">Create</button>  
    25. </body>  
    26. </html>  



     

    1.4、currentWebview: 获取当前窗口的WebviewObject对象

          WebviewObject plus.webview.currentWebview();

    说明:获取当前页面所属的Webview窗口对象。

    返回值:WebviewObject : Webview窗口对象

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. var ws=plus.webview.currentWebview();  
    10. console.log( "当前Webview窗口:"+ws.getURL() );  
    11. }  
    12. if(window.plus){  
    13. plusReady();  
    14. }else{  
    15. document.addEventListener("plusready",plusReady,false);  
    16. }  
    17. </script>  
    18. </head>  
    19. <body>  
    20. 获取自身Webview窗口  
    21. </body>  
    22. </html>  

     

    1.5、getWebviewById: 查找指定标识的WebviewObject窗口

          WebviewObject plus.webview.getWebviewById( id );

    说明:在已创建的窗口列表中查找指定标识的Webview窗口并返回。 若没有查找到指定标识的窗口则返回null,若存在多个相同标识的Webview窗口,则返回第一个创建的Webview窗口。 如果要获取应用入口页面所属的Webview窗口,其标识为应用的%APPID%,可通过plus.runtime.appid获取。

    参数:id: ( String ) 必选 要查找的Webview窗口标识

    返回值:WebviewObject : WebviewObject窗口对象

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. // 查找应用首页窗口对象  
    10. var h=plus.webview.getWebviewById( plus.runtime.appid );  
    11. console.log( "应用首页Webview窗口:"+h.getURL() );  
    12. }  
    13. if(window.plus){  
    14. plusReady();  
    15. }else{  
    16. document.addEventListener("plusready",plusReady,false);  
    17. }  
    18. </script>  
    19. </head>  
    20. <body>  
    21. 查找指定标识的窗口  
    22. </body>  
    23. </html>  

     

    1.6、getLaunchWebview: 获取应用首页WebviewObject窗口对象

           WebviewObject plus.webview.getLaunchWebview();

    返回值:WebviewObject : WebviewObject窗口对象

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. // 获取应用首页窗口对象  
    10. var h=plus.webview.getLaunchWebview();  
    11. console.log( "应用首页Webview窗口:"+h.getURL() );  
    12. }  
    13. if(window.plus){  
    14. plusReady();  
    15. }else{  
    16. document.addEventListener("plusready",plusReady,false);  
    17. }  
    18. </script>  
    19. </head>  
    20. <body>  
    21. 获取应用首页WebviewObject窗口对象  
    22. </body>  
    23. </html>  

     

    1.7、getTopWebview: 获取应用显示栈顶的WebviewObject窗口对象

        WebviewObject plus.webview.getTopWebview();

    返回值:WebviewObject : WebviewObject窗口对象

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. // 获取应用首页窗口对象  
    10. var h=plus.webview.getTopWebview();  
    11. console.log( "应用显示栈顶的Webview窗口:"+h.getURL() );  
    12. }  
    13. if(window.plus){  
    14. plusReady();  
    15. }else{  
    16. document.addEventListener("plusready",plusReady,false);  
    17. }  
    18. </script>  
    19. </head>  
    20. <body>  
    21. 获取应用显示栈顶的WebviewObject窗口对象  
    22. </body>  
    23. </html>  



     

    1.8、hide: 隐藏Webview窗口

          void plus.webview.hide( id_wvobj, aniHide, duration, extras );

    说明:根据指定的WebviewObject对象或id隐藏Webview窗口,使得窗口不可见。

    参数:

    id_wvobj: ( String | WebviewObject ) 必选 要隐藏的Webview窗口id或窗口对象。使用窗口对象时,若窗口对象已经隐藏,则无任何效果。 使用窗口id时,则查找对应id的窗口,如果有多个相同id的窗口则操作最先打开的,若没有查找到对应id的WebviewObject对象,则无任何效果。

    aniHide: ( AnimationTypeClose) 可选 隐藏Webview窗口的动画效果。如果没有指定窗口动画,则使用默认动画效果“none”。

    duration: ( Number ) 可选 隐藏Webview窗口动画的持续时间。单位为ms,如果没有设置则使用默认窗口动画时间。

    extras: ( WebviewExtraOptions) 可选 隐藏Webview窗口扩展参数。可用于指定Webview窗口动画是否使用图片加速。

    返回值:void : 无

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. }  
    10. if(window.plus){  
    11. plusReady();  
    12. }else{  
    13. document.addEventListener("plusready",plusReady,false);  
    14. }  
    15. // 隐藏自身窗口  
    16. function hideeme(){  
    17. plus.webview.hide( plus.webview.currentWebview() );  
    18. }  
    19. </script>  
    20. </head>  
    21. <body>  
    22. 隐藏Webview窗口<br/>  
    23. <button onclick="hideeme()">Hide</button>  
    24. </body>  
    25. </html>  



     

    1.9、open: 创建并打开Webview窗口

             WebviewObject plus.webview.open( url, id, styles, aniShow, duration, showedCB );

    说明:创建并显示Webview窗口,用于加载新的HTML页面,可通过styles设置Webview窗口的样式,创建完成后自动将Webview窗口显示出来。

    参数:

    url: ( String ) 可选 打开窗口加载的HTML页面地址。新打开Webview窗口要加载的HTML页面地址,可支持本地地址和网络地址。

    id: ( String ) 可选 打开窗口的标识。窗口标识可用于在其它页面中通过getWebviewById来查找指定的窗口,为了保持窗口标识的唯一性,应该避免使用相同的标识来创建多个Webview窗口。 如果传入无效的字符串则使用url参数作为WebviewObject窗口的id值。

    styles: ( WebviewStyles) 可选 创建Webview窗口的样式(如窗口宽、高、位置等信息)

    aniShow: ( AnimationTypeShow) 可选 显示Webview窗口的动画效果。如果没有指定窗口动画,则使用默认无动画效果“none”。

    duration: ( Number ) 可选 显示Webview窗口动画的持续时间。单位为ms,如果没有设置则使用默认窗口动画时间600ms。

    showedCB: ( SuccessCallback ) 可选 Webview窗口显示完成的回调函数。当指定Webview窗口显示动画执行完毕时触发回调函数,窗口无动画效果(如"none"动画效果)时也会触发此回调。

    返回值:WebviewObject : WebviewObject窗口对象

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. }  
    10. if(window.plus){  
    11. plusReady();  
    12. }else{  
    13. document.addEventListener("plusready",plusReady,false);  
    14. }  
    15. // 创建并显示新窗口  
    16. function openWebview(){  
    17. var w = plus.webview.open( "http://weibo.com/dhnetwork" );  
    18. }  
    19. </script>  
    20. </head>  
    21. <body>  
    22. 打开Webview窗口<br/>  
    23. <button onclick="openWebview()">Open</button>  
    24. </body>  
    25. </html>  



     

    1.10、show: 显示Webview窗口

       void plus.webview.show( id_wvobj, aniShow, duration, showedCB, extras );

    说明:显示已创建或隐藏的Webview窗口,需先获取窗口对象或窗口id,并可指定显示窗口的动画及动画持续时间。

    参数:

    id_wvobj: ( String | WebviewObject ) 必选 要显示Webview窗口id或窗口对象。若操作Webview窗口对象显示,则无任何效果。 使用窗口id时,则查找对应id的窗口,如果有多个相同id的窗口则操作最先创建的窗口,若没有查找到对应id的WebviewObject对象,则无任何效果。

    aniShow: ( AnimationTypeShow) 可选 显示Webview窗口的动画效果。如果没有指定窗口动画类型,则使用默认值“auto”,即自动选择上一次显示窗口的动画效果,如果之前没有显示过,则使用“none”动画效果。

    duration: ( Number ) 可选 显示Webview窗口动画的持续时间。单位为ms,如果没有设置则使用默认窗口动画时间600ms。

    showedCB: ( SuccessCallback ) 可选 Webview窗口显示完成的回调函数。当指定Webview窗口显示动画执行完毕时触发回调函数,窗口无动画效果(如"none"动画效果)时也会触发此回调。

    extras: ( WebviewExtraOptions) 可选 显示Webview窗口扩展参数。可用于指定Webview窗口动画是否使用图片加速。

    返回值:WebviewObject : Webview窗口对象

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. }  
    10. if(window.plus){  
    11. plusReady();  
    12. }else{  
    13. document.addEventListener("plusready",plusReady,false);  
    14. }  
    15.    
    16. // 创建并显示新窗口  
    17. function create(){  
    18. var w = plus.webview.create( "http://weibo.com/dhnetwork" );  
    19. plus.webview.show( w ); // 显示窗口  
    20. }  
    21. </script>  
    22. </head>  
    23. <body>  
    24. 显示Webview窗口<br/>  
    25. <button onclick="create()">Create</button>  
    26. </body>  
    27. </html>  

     

     

    1.11、defaultHardwareAccelerated: 获取Webview默认是否开启硬件加速

            Boolean plus.webview.defaultHardwareAccelerated();

    说明:由于不同设备对硬件加速的支持情况存在差异,开启硬件加速能加速HTML页面的渲染,但也会消耗更多的系统资源,从而导致在部分设备上可能出现闪屏、发虚、分块渲染等问题, 因此5+ Runtime会根据设备实际支持情况自动选择是否开启硬件加速。 关闭硬件加速则可能会导致Webview页面无法支持Video标签播放视频等问题,如果在特定情况下需要调整修改默认开启硬件加速的行为,则可通过plus.webview.defaultHardwareAccelerated()方法获取当前设备默认是否开启硬件加速状态,从而决定是否需要显式开启或关闭指定Webview的硬件加速功能(通过WebviewStyles的hardwareAccelerated属性设置)。

    返回值:Boolean : Webview窗口默认开启硬件加速则返回true,否则返回false。

    平台支持:Android - 2.3+ (支持): 返回当前设备默认是否开启硬件加速。iOS - 5.1+ (不支持): 返回固定值true。

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. }  
    10. if(window.plus){  
    11. plusReady();  
    12. }else{  
    13. document.addEventListener("plusready",plusReady,false);  
    14. }  
    15.    
    16. // 创建新窗口并设置开启硬件加速  
    17. function create(){  
    18. var styles={};  
    19. // 在Android5以上设备,如果默认没有开启硬件加速,则强制设置开启  
    20. if(!plus.webview.defaultHardwareAccelerated()&&parseInt(plus.os.version)>=5){  
    21. styles.hardwareAccelerated=true;  
    22. }  
    23. var w = plus.webview.create( "http://weibo.com/dhnetwork", "test", styles );  
    24. plus.webview.show( w ); // 显示窗口  
    25. }  
    26. </script>  
    27. </head>  
    28. <body>  
    29. 开启硬件加速显示Webview窗口<br/>  
    30. <button onclick="create()">Create</button>  
    31. </body>  
    32. </html>  



     

    2、对象

    AnimationTypeShow: 一组用于定义页面或控件显示动画效果

    AnimationTypeClose: 一组用于定义页面或控件关闭的动画效果

    WebviewObject: Webview窗口对象,用于操作加载HTML页面的窗口

    WebviewBounceStyle: Webview窗口回弹样式

    WebviewDock: 原生控件在窗口中停靠的方式

    WebviewEvent: Webview窗口事件

    WebviewRefreshStyle: Webview窗口下拉刷新样式

    WebviewPosition: 原生控件在窗口中显示的位置

    WebviewStyles: JSON对象,原生窗口设置参数的对象

    WebviewExtraOptions: JSON对象,原生窗口扩展参数

    WebviewTransform: 一组用于定义页面或控件变形的属性

    WebviewTransition: 一组用于定义页面或控件转换效果的属性

    WebviewOverrideUrlOptions: 拦截Webview窗口URL请求的属性

    3、回调方法

    BounceEventCallback: Webview窗口回弹事件的回调函数

    EventCallback: Webview窗口事件的回调函数

    PopGestureCallback: Webview窗口侧滑事件的回调函数

    HistoryQueryCallback: 历史记录记录查询的回调函数

    OverrideUrlLoadingCallback: Webview窗口拦截URL链接跳转的回调函数

    TitleUpdateCallback: Webview窗口加载页面标题更新的回调函数

    SuccessCallback: Webview窗口操作成功回调函数

    ErrorCallback: Webview窗口操作失败回调函数

     

    二、重点

    1、 在Webview窗口中添加子窗口

     

    [html] view plain copy
     
    1. embed=plus.webview.create("http://weibo.com/dhnetwork","",{top:"46px",bottom:"0px"});  
    2. plus.webview.currentWebview().append( embed );  
    3. 与下面使用show显示Webview窗口效果一样。  
    4. ws=plus.webview.currentWebview();  
    5. embed=plus.webview.create("http://weibo.com/dhnetwork","",{top:"46px",bottom:"0px"});  
    6. embed.show();  

     

    2、appendJsFile和setJsFile

    (1)、wobj.appendJsFile( file ):添加Webview窗口预加载js文件

        对于一些网络HTML页面,在无法修改HTML页面时可通过此方法自动加载本地js文件。 当Webview窗口跳转到新页面时也会自动加载指定的js执行,添加多个js文件将按照添加的先后顺序执行。

     

    [html] view plain copy
     
    1. var nw=plus.webview.create("http://weibo.com/dhnetwork");  
    2. nw.appendJsFile("_www/preload.js");  
    3. nw.show();  

     

    (2)、void wobj.setJsFile( path ):设置预加载的JS文件

        预加载JS文件不需要在HTML页面中显式引用,在Webview窗口加载HTML页面时自动加载,在页面跳转时也会自动加载。 设置新的JS文件后将清空之前设置的值。

     

    [html] view plain copy
     
    1. ws=plus.webview.currentWebview();  
    2. embed=plus.webview.create("http://weibo.com/dhnetwork");  
    3. embed.setJsFile( "_www/js/preload.js" );  
    4. ws.append(embed);  



     

    3、clear:、hide和close

    (1)、clear: 清空原生Webview窗口加载的内容

               void wobj.clear();

     

    说明:清除原生窗口的内容,用于重置原生窗口加载的内容,清除其加载的历史记录等内容。

     

    [html] view plain copy
     
    1. embed=plus.webview.create("http://weibo.com/dhnetwork","",{top:"46px",bottom:"0px"});  
    2. plus.webview.currentWebview().append( embed );  
    3. embed.clear();  

     

    (2)、hide: 隐藏Webview窗口

          void plus.webview.hide( id_wvobj, aniHide, duration, extras );

    说明:根据指定的WebviewObject对象或id隐藏Webview窗口,使得窗口不可见。

         plus.webview.hide( plus.webview.currentWebview() );

    (3)、hide: 隐藏Webview窗口

             void wobj.hide( aniHide, duration, extras );

    说明:隐藏Webview窗口可保存已加载HTML页面的上下文数据,能降低应用使用的系统资源,通过show方法可将隐藏的Webview窗口显示出来。

     

    [html] view plain copy
     
    1. ws=plus.webview.currentWebview();  
    2. embed=plus.webview.create("http://weibo.com/dhnetwork","",{top:"46px",bottom:"0px"});  
    3. embed.show();  
    4. embed.hide();  

     

    (4)、close: 关闭Webview窗口

          void plus.webview.close( id_wvobj, aniClose, duration, extras );

    说明:关闭已经打开的Webview窗口,需先获取窗口对象或窗口id,并可指定关闭窗口的动画及动画持续时间。

     

    [html] view plain copy
     
    1. var ws=plus.webview.currentWebview();  
    2. plus.webview.close(ws);  

     

    (5)、close: 关闭Webview窗口

           void wobj.close( aniClose, duration, extras );

    说明:关闭并销毁Webview窗口,可设置关闭动画和动画持续时间。

     

    [html] view plain copy
     
    1. ws=plus.webview.currentWebview();  
    2. ws.close();  

     

    4、setPullToRefresh:设置Webview窗口的下拉刷新效果

           void wobj.setPullToRefresh( style, refreshCB );

     

    说明:开启Webview窗口的下拉刷新功能,显示窗口内置的下拉刷新控件样式。

    参数:

    style: ( WebviewRefreshStyle) 必选 Webview窗口下拉刷新样式参数。可设置窗口内置的下拉刷新控件在各种状态显示的文字内容。

    refreshCB: ( SuccessCallback ) 必选 Webview窗口下拉刷新事件回调。用户操作窗口的下拉刷新触发窗口刷新事件时触发。

    返回值:void : 无

    平台支持:Android - 2.2+ (支持),iOS - ALL (支持)

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE HTML>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8"/>  
    5. <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>  
    6. <meta name="HandheldFriendly" content="true"/>  
    7. <meta name="MobileOptimized" content="320"/>  
    8. <title>Webview Example</title>  
    9. <script type="text/javascript" charset="utf-8">  
    10. var ws=null;var list=null;  
    11. // 扩展API加载完毕,现在可以正常调用扩展API  
    12. function plusReady(){  
    13. ws=plus.webview.currentWebview();  
    14. ws.setPullToRefresh({support:true,  
    15. height:"50px",  
    16. range:"200px",  
    17. contentdown:{  
    18. caption:"下拉可以刷新"  
    19. },  
    20. contentover:{  
    21. caption:"释放立即刷新"  
    22. },  
    23. contentrefresh:{  
    24. caption:"正在刷新..."  
    25. }  
    26. },onRefresh);  
    27. plus.nativeUI.toast("下拉可以刷新");  
    28. }  
    29. // 判断扩展API是否准备,否则监听"plusready"事件  
    30. if(window.plus){  
    31. plusReady();  
    32. }else{  
    33. document.addEventListener("plusready",plusReady,false);  
    34. }  
    35. // DOM构建完成获取列表元素  
    36. document.addEventListener("DOMContentLoaded",function(){  
    37. list=document.getElementById("list");  
    38. })  
    39. // 刷新页面  
    40. function onRefresh(){  
    41. setTimeout(function(){  
    42. if(list){  
    43. var item=document.createElement("li");  
    44. item.innerHTML="<span>New Item "+(new Date())+"</span>";  
    45. list.insertBefore(item,list.firstChild);  
    46. }  
    47. ws.endPullToRefresh();  
    48. },2000);  
    49. }  
    50. </script>  
    51. <link rel="stylesheet" href="../css/common.css" type="text/css" charset="utf-8"/>  
    52. <style type="text/css">  
    53. li {  
    54. padding: 1em;  
    55. border-bottom: 1px solid #eaeaea;  
    56. }  
    57. li:active {  
    58. background: #f4f4f4;  
    59. }  
    60. </style>  
    61. </head>  
    62. <body>  
    63. <ul id="list" style="list-style:none;margin:0;padding:0;">  
    64. <li><span>Initializ List Item 1</span></li>  
    65. <li><span>Initializ List Item 2</span></li>  
    66. <li><span>Initializ List Item 3</span></li>  
    67. <li><span>Initializ List Item 4</span></li>  
    68. <li><span>Initializ List Item 5</span></li>  
    69. <li><span>Initializ List Item 6</span></li>  
    70. <li><span>Initializ List Item 7</span></li>  
    71. <li><span>Initializ List Item 8</span></li>  
    72. <li><span>Initializ List Item 9</span></li>  
    73. <li><span>Initializ List Item 10</span></li>  
    74. </ul>  
    75. </body>  
    76. </html>  



     

    5、setStyle:设置Webview窗口的样式

            void wobj.setStyle( styles );

    说明:更新Webview窗口的样式,如窗口位置、大小、背景色等。

    参数:styles: ( WebviewStyles ) 必选 要设置的窗口样式

    返回值:void : 无

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. var ws=null,embed=null;  
    8. // H5 plus事件处理  
    9. function plusReady(){  
    10. ws=plus.webview.currentWebview();  
    11. embed=plus.webview.create("http://weibo.com/dhnetwork","",{top:"46px",bottom:"0px"});  
    12. ws.append(embed);  
    13. }  
    14. if(window.plus){  
    15. plusReady();  
    16. }else{  
    17. document.addEventListener("plusready",plusReady,false);  
    18. }  
    19. // 设置Webview窗口的样式  
    20. function updateStyle() {  
    21. embed.setStyle( {top:"92px"} );  
    22. }  
    23. </script>  
    24. </head>  
    25. <body>  
    26. 设置Webview窗口的样式  
    27. <button onclick="updateStyle()">setStyle</button>  
    28. </body>  
    29. </html>  



     

    6、setBounce:设置Webview窗口的回弹效果

            void wobj.setBounce( style );

    说明:开启窗口回弹效果后,当窗口中展现的内容滚动到头(顶部或底部)时,再拖拽时窗口整体内容将跟随移动,松开后自动回弹到停靠位置(可通过style设置)。 拖拽窗口内容时页面显示Webview窗口的背景色,默认为透明,此时显示Webview下面的内容,利用这个特点可以实现自定下拉刷新特效。

    参数:

    style: ( WebviewBounceStyle) 必选 Webview窗口回弹样式参数,可设置窗口的回弹效果支持的方向,自动回弹后停靠的位置等参数。

    返回值:void : 无

    平台支持:Android - 2.2+ (支持),iOS - ALL (不支持)

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. var ws=null;  
    8. // H5 plus事件处理  
    9. function plusReady(){  
    10. ws=plus.webview.currentWebview();  
    11. ws.setBounce({position:{top:"100px"},changeoffset:{top:"0px"}});  
    12. }  
    13. if(window.plus){  
    14. plusReady();  
    15. }else{  
    16. document.addEventListener("plusready",plusReady,false);  
    17. }  
    18. </script>  
    19. </head>  
    20. <body style="text-align:center;">  
    21. <br/><br/><br/>  
    22. 设置Webview窗口的回弹效果<br/><br/><br/>  
    23. *暂仅支持顶部的回弹效果*  
    24. </body>  
    25. </html>  



     

    7、setBlockNetworkImage:设置Webview窗口是否阻塞加载页面中使用的网络图片

          void wobj.setBlockNetworkImage( block );

     

    参数:block: ( Boolean ) 必选 是否阻塞加载网络图片。true表示不加载页面中使用的网络图片,false表示加载也页面中使用的网络图片。

    返回值:void : 无

    平台支持:Android - 2.2+ (支持),iOS - ALL (不支持)

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. var ws=null;  
    8. // H5 plus事件处理  
    9. function plusReady(){  
    10. }  
    11. if(window.plus){  
    12. plusReady();  
    13. }else{  
    14. document.addEventListener("plusready",plusReady,false);  
    15. }  
    16. function blockOpen(){  
    17. // 阻塞网络图片模式打开页面  
    18. var w=plus.webview.create("http://m.csdn.net/","csdn",{blockNetworkImage:true});  
    19. w.addEventListener("loaded",function(){  
    20. w.show("slide-in-right",300);  
    21. // 加载网络图片  
    22. w.setBlockNetworkImage(false);  
    23. },false);  
    24. }  
    25. </script>  
    26. </head>  
    27. <body>  
    28. 显示窗口后再加载网络图片<br/>  
    29. <button onclick="blockOpen()">打开页面</button>  
    30. </body>  
    31. </html>  



     

     

    8、addEventListener:添加事件监听器

            wobj.addEventListener( event, listener, capture );

    说明:向Webview窗口添加事件监听器,当指定的事件发生时,将触发listener函数的执行。 可多次调用此方法向Webview添加多个监听器,当监听的事件发生时,将按照添加的先后顺序执行。 

    参数:

    event: ( WebviewEvent ) 必选 Webview窗口事件类型

    listener: ( EventCallback ) 必选 监听事件发生时执行的回调函数

    capture: ( Boolean ) 可选 捕获事件流顺序,暂无效果

    返回值:void : 无

    示例:

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. // H5 plus事件处理  
    8. function plusReady(){  
    9. }  
    10. if(window.plus){  
    11. plusReady();  
    12. }else{  
    13. document.addEventListener("plusready",plusReady,false);  
    14. }  
    15. var nw=null;  
    16. // 监听Webview窗口事件  
    17. function eventTest() {  
    18. if(nw){return;}  
    19. var w=plus.nativeUI.showWaiting()  
    20. // 打开新窗口  
    21. nw=plus.webview.create( "http://weibo.com/dhnetwork" );  
    22. nw.addEventListener( "loaded", function(){  
    23. console.log( "New Window loaded!" );  
    24. nw.show(); // 显示窗口  
    25. w.close();  
    26. w=null;  
    27. }, false );  
    28. }  
    29. </script>  
    30. </head>  
    31. <body>  
    32. 添加事件监听器<br/>  
    33. <button onclick="eventTest()">Event Listener</button>  
    34. </body>  
    35. </html>  



     

    9、WebviewEvent:Webview窗口事件

       (1)、"close": (String 类型 )Webview窗口关闭事件。通过WebviewObject对象的addEventListener方法添加事件监听函数,当Webview窗口关闭时触发此事件,回调函数类型为EventCallback。

       (2)、"dragBounce": (String 类型 )Webview窗口回弹事件。通过WebviewObject对象的setBounce方法开启回弹效果设置顶部下拉回弹changeoffset属性后,当用户向下拖拽窗口时触发发此事件,回调函数类型为BounceEventCallback。

       (3)、"slideBounce": (String 类型 )Webview窗口回弹事件。通过WebviewObject对象的setBounce方法开启回弹效果设置左右侧侧滑slideoffset属性后,当用户向左右侧拖拽窗口侧滑时触发发此事件,回调函数类型为BounceEventCallback。

       (4)、"error": (String 类型 )Webview窗口加载错误事件。通过WebviewObject对象的addEventListener方法添加事件监听函数,当Webview窗口加载错误时触发此事件,回调函数类型为EventCallback。

       (5)、"hide": (String 类型 )Webview窗口隐藏事件。通过WebviewObject对象的addEventListener方法添加事件监听函数,当Webview窗口隐藏(窗口动画完成后)时触发此事件,回调函数类型为EventCallback。

       (6)、"loading": (String 类型 )Webview窗口页面开始加载事件。通过WebviewObject对象的addEventListener方法添加事件监听函数,当Webview窗口开始加载新页面时触发此事件,回调函数类型为EventCallback。

       (7)、"loaded": (String 类型 )Webview窗口页面加载完成事件。通过WebviewObject对象的addEventListener方法添加事件监听函数,当Webview窗口页面加载完成时触发此事件,回调函数类型为EventCallback。

       (8)、"maskClick": (String 类型 )Webview窗口显示遮罩层时点击事件。通过WebviewObject对象的addEventListener方法添加事件监听函数,当Webview窗口通过mask属性设置显示遮罩层并且点击时触发此事件,回调函数类型为EventCallback。

       (9)、"show": (String 类型 )Webview窗口显示事件。通过WebviewObject对象的addEventListener方法添加事件监听函数,当Webview窗口显示(窗口动画完成后)时触发此事件,回调函数类型为EventCallback。

       (10)、"popGesture": (String 类型 )Webview窗口侧滑返回事件。通过WebviewObject对象的addEventListener方法添加事件监听函数,当Webview窗口侧滑返回时触发此事件,回调函数类型为PopGestureCallback。

       (11)、"titleUpdate": (String 类型 )Webview加载页面标题更新事件。通过WebviewObject对象的addEventListener方法添加事件监听函数,当Webview窗口加载新页面更新标题时触发此事件,回调函数类型为SuccessCallback。 注意:此事件会先于loaded事件触发,通常在加载网络页面时通过此事件可更快获取到页面的标题。

    10、事件

    (1)、onclose: Webview窗口关闭事件

     

    [html] view plain copy
     
    1. <!DOCTYPE html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>Webview Example</title>  
    6. <script type="text/javascript">  
    7. var ws=null,embed=null;  
    8. // H5 plus事件处理  
    9. function plusReady(){  
    10. ws=plus.webview.currentWebview();  
    11. embed=plus.webview.create("http://weibo.com/dhnetwork","",{top:"46px",bottom:"0px"});  
    12. embed.onclose=embedClose;  
    13. ws.append(embed);  
    14. }  
    15. if(window.plus){  
    16. plusReady();  
    17. }else{  
    18. document.addEventListener("plusready",plusReady,false);  
    19. }  
    20. // 页面关闭事件回调函数  
    21. function embedClose(e){  
    22. alert( "Closed!" );  
    23. }  
    24. </script>  
    25. </head>  
    26. <body>  
    27. Webview窗口关闭事件  
    28. <button onclick="embed.close()">onclose</button>  
    29. </body>  
    30. </html>  



     

    (2)、onerror: Webview窗口错误事件

    (3)、onloaded: Webview窗口页面加载完成事件

    (4)、onloading: Webview窗口页面开始加载事件

  • 相关阅读:
    11 改进版通过队列实现一个生产者消费者模型
    13 精进版SVIP版通过队列实现一个生产者消费者模型
    12 再次改进版通过队列实现一个生产者消费者模型
    31 进程
    join方法
    30 进程 线程
    进程传参方式和创建方式2
    设计模式 单例模式
    设计模式 抽象工厂模式
    设计模式 简单工厂模式
  • 原文地址:https://www.cnblogs.com/1102whw/p/7786680.html
Copyright © 2011-2022 走看看