index.html 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>GridManager demo</title>
  6. <link rel="stylesheet" href="./css/layout.css"/>
  7. </head>
  8. <body>
  9. <section class="demo-site">
  10. <div class="demo-tabs">
  11. <span class="demo-ele" data-url="./demo1.html">带搜索功能的动态数据</span>
  12. <span class="demo-ele" data-url="./demo2.html">简易静态数据</span>
  13. <span class="demo-ele" data-url="./demo3.html">多表 I18N</span>
  14. <span class="demo-ele" data-url="./demo4.html">通栏样式</span>
  15. <span class="demo-ele" data-url="./demo5.html">单选行</span>
  16. <span class="demo-ele" data-url="./demo6.html">无总页</span>
  17. <span class="demo-ele" data-url="./demo7.html">延迟总页</span>
  18. <span class="demo-ele" data-url="./demo8.html">嵌套表头</span>
  19. <span class="demo-ele" data-url="./demo9.html">数据折叠</span>
  20. <span class="demo-ele" data-url="./jquery.html">jquery</span>
  21. <span class="demo-ele" data-url="./promise.html">promise</span>
  22. </div>
  23. <iframe id="demo-iframe"></iframe>
  24. </section>
  25. <script type="text/javascript">
  26. [].forEach.call(document.querySelectorAll('.demo-ele'), function(v, i){
  27. v.addEventListener('click', function () {
  28. document.querySelector('#demo-iframe').src = this.getAttribute('data-url');
  29. [].forEach.call(document.querySelectorAll('.demo-ele'), function(v2, i2){
  30. v2.removeAttribute('selected');
  31. });
  32. this.setAttribute('selected', 'selected')
  33. });
  34. });
  35. document.querySelector('.demo-ele').click();
  36. </script>
  37. </body>
  38. </html>