一、知识点

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. function create(){
  17. var w = plus.webview.create( "http://weibo.com/dhnetwork" );
  18. plus.webview.show( w ); // 显示窗口
  19. }
  20. </script>
  21. </head>
  22. <body>
  23. 显示Webview窗口<br/>
  24. <button onclick="create()">Create</button>
  25. </body>
  26. </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. function create(){
  17. var styles={};
  18. // 在Android5以上设备,如果默认没有开启硬件加速,则强制设置开启
  19. if(!plus.webview.defaultHardwareAccelerated()&&parseInt(plus.os.version)>=5){
  20. styles.hardwareAccelerated=true;
  21. }
  22. var w = plus.webview.create( "http://weibo.com/dhnetwork", "test", styles );
  23. plus.webview.show( w ); // 显示窗口
  24. }
  25. </script>
  26. </head>
  27. <body>
  28. 开启硬件加速显示Webview窗口<br/>
  29. <button onclick="create()">Create</button>
  30. </body>
  31. </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. function create(){
  17. var w = plus.webview.create( "http://weibo.com/dhnetwork" );
  18. plus.webview.show( w ); // 显示窗口
  19. }
  20. </script>
  21. </head>
  22. <body>
  23. 显示Webview窗口<br/>
  24. <button onclick="create()">Create</button>
  25. </body>
  26. </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. function create(){
  17. var styles={};
  18. // 在Android5以上设备,如果默认没有开启硬件加速,则强制设置开启
  19. if(!plus.webview.defaultHardwareAccelerated()&&parseInt(plus.os.version)>=5){
  20. styles.hardwareAccelerated=true;
  21. }
  22. var w = plus.webview.create( "http://weibo.com/dhnetwork", "test", styles );
  23. plus.webview.show( w ); // 显示窗口
  24. }
  25. </script>
  26. </head>
  27. <body>
  28. 开启硬件加速显示Webview窗口<br/>
  29. <button onclick="create()">Create</button>
  30. </body>
  31. </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窗口页面开始加载事件

HTML5+规范:Webview的使用详解的更多相关文章

  1. html5的float属性超详解(display,position, float)(文本流)

    html5的float属性超详解(display,position, float)(文本流) 一.总结 1.文本流: 2.float和绝对定位都不占文本流的位置 3.普通流是默认定位方式,就是依次按照 ...

  2. [js高手之路] html5 canvas系列教程 - 状态详解(save与restore)

    本文内容与路径([js高手之路] html5 canvas系列教程 - 开始路径beginPath与关闭路径closePath详解)是canvas中比较重要的概念.掌握理解他们是做出复杂canvas动 ...

  3. html5中viewport与meta详解

    网上解释手机浏览器是把页面放在一个虚拟的"窗口"(viewport)中,通常这个虚拟的"窗口"(viewport)比屏幕宽,这样就不用把每个网页挤到很小的窗口中 ...

  4. 编译原理LR(0)项目集规范族的构造详解

    转载于https://blog.csdn.net/johan_joe_king/article/details/79051993#comments 学编译原理的时候,感觉什么LL(1).LR(0).S ...

  5. HTML5全局属性和事件详解

    属性: HTML5属性能够赋给标签元素含义和语境,下面的全局属性可用于任何 HTML5 元素. 属性 描述 contenteditable 规定是否允许用户编辑内容. contextmenu 规定元素 ...

  6. HTML5 LocalStorage 本地存储原理详解

    首先自然是检测浏览器是否支持本地存储.在HTML5中,本地存储是一个window的属性,包括localStorage和sessionStorage,从名字应该可以很清楚的辨认二者的区别,前者是一直存在 ...

  7. HTML5 中的Nav元素详解

    什么是Nav元素 Nav元素可以用作页面导航的链接组,在导航链接组里面有很多的链接,点击每个链接可以链接到其他页面或者当前页面的其他部分,并不是所有的链接组都要被放在nav元素里面,我们只需要把最主要 ...

  8. html5 Canvas绘制图形入门详解

    html5,这个应该就不需要多作介绍了,只要是开发人员应该都不会陌生.html5是「新兴」的网页技术标准,目前,除IE8及其以下版本的IE浏览器之外,几乎所有主流浏览器(FireFox.Chrome. ...

  9. HTML5 自定义属性 data-* 和 jQuery.data 详解

    新的HTML5标准允许你在普通的元素标签里,嵌入类似data-*的属性,来实现一些简单数据的存取.它的数量不受限制,并且也能由javascript动态修改,也支持CSS选择器进行样式设置.这使得dat ...

随机推荐

  1. PHP && ,and ,||,or 的区别

    PHP中的逻辑“与”运算有两种形式:AND 和 &&,同样“或”运算也有OR和||两种形式. 如果是单独两个表达式参加的运算,两种形式的结果完全相同,例如 $a AND $b和$a & ...

  2. CTF-安恒19年一月月赛部分writeup

    CTF-安恒19年一月月赛部分writeup MISC1-赢战2019 是一道图片隐写题 linux下可以正常打开图片,首先到binwalk分析一下. 里面有东西,foremost分离一下 有一张二维 ...

  3. wav2midi 音乐旋律提取算法 附可执行demo

    前面提及过,音频指纹算法的思路. 也梳理开源了两个比较经典的算法. https://github.com/cpuimage/shazam https://github.com/cpuimage/Aud ...

  4. pyhton习题20190201

    #20190131'''检查ipV4的有效性,有效则返回True,否则返回False,(提示使用split函数进行分割)'''import osdef print_ping_ip(ip): s = o ...

  5. postgresql 安装插件

    最近由于工作需要,学习了citusdata 插件,在按照官方文档装好postgresql 之后,不能在psql 中正常启用其它插件  如 : "create extension pg_trg ...

  6. 20155235 2016-2017-2 《Java程序设计》第4周学习总结

    20155235 2016-2017-2 <Java程序设计>第4周学习总结 教材学习内容总结 第六章知识点: 何为继承 继承共同行为 多态与is-a 重新定义行为 抽象方法.抽象类 继承 ...

  7. 20155336 实验三 敏捷开发与XP实践

    20155336 实验三 敏捷开发与XP实践 实验内容 XP基础 XP核心实践 相关工具 实验内容及步骤 (一)编码标准:在IDEA中使用工具(Code->Reformate Code)把代码重 ...

  8. js页面动态时间展示

    效果图: 具体代码 js代码 <script type="text/javascript"> var t = null; t = setTimeout(time,100 ...

  9. [IOI2011]Race 点分治

    [IOI2011]Race LG传送门 点分治板子题. 直接点分治统计,统计的时候开个桶维护下就好了. 注(tiao)意(le)细(hen)节(jiu). #include<cstdio> ...

  10. ADO.NET操作MySQL数据库

    前言 ADO.NET包括5大对象,分别是Connection.Command.DataReader.DataSet.DataAdapter,使用ADO.NET访问数据库有两个步骤:建立数据库连接.读取 ...