webview_pullcustom_content.html 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  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>Hello H5+</title>
  9. <script type="text/javascript" charset="utf-8">
  10. var ws=null,wo=null;
  11. // 扩展API加载完毕,现在可以正常调用扩展API
  12. function plusReady(){
  13. // 获取自身窗口
  14. ws=plus.webview.currentWebview();
  15. wo=ws.opener();
  16. }
  17. // 判断扩展API是否准备,否则监听"plusready"事件
  18. if(window.plus){
  19. plusReady();
  20. }else{
  21. document.addEventListener("plusready",plusReady,false);
  22. }
  23. // DOM构建完成获取列表元素
  24. var list=null;
  25. document.addEventListener("DOMContentLoaded",function(){
  26. list=document.getElementById("list");
  27. });
  28. // 刷新页面
  29. function onRefresh(){
  30. setTimeout(function(){
  31. if(list){
  32. var item=document.createElement("li");
  33. item.innerHTML="<span>New Item "+(new Date())+"</span>";
  34. list.insertBefore(item,list.firstChild);
  35. }
  36. ws.resetBounce();
  37. setTimeout(function(){
  38. wo.evalJS("pullReset()");
  39. },200);
  40. },1000);
  41. }
  42. </script>
  43. <link rel="stylesheet" href="../css/common.css" type="text/css" charset="utf-8"/>
  44. <style type="text/css">
  45. li {
  46. padding: 1em;
  47. border-bottom: 1px solid #eaeaea;
  48. }
  49. li:active {
  50. background: #f4f4f4;
  51. }
  52. </style>
  53. </head>
  54. <body>
  55. <ul id="list" style="list-style:none;margin:0;padding:0;">
  56. <li><span onclick="alert('ok');">Initializ List Item 1</span></li>
  57. <li><span>Initializ List Item 2</span></li>
  58. <li><span>Initializ List Item 3</span></li>
  59. <li><span>Initializ List Item 4</span></li>
  60. <li><span>Initializ List Item 5</span></li>
  61. <li><span>Initializ List Item 6</span></li>
  62. <li><span>Initializ List Item 7</span></li>
  63. <li><span>Initializ List Item 8</span></li>
  64. <li><span>Initializ List Item 9</span></li>
  65. <li><span>Initializ List Item 10</span></li>
  66. </ul>
  67. </body>
  68. </html>