index_01_gateway.php 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. <!doctype html>
  2. <html lang="en">
  3. <!--
  4. 借地写说明:
  5. jquery-ui的说明参考:http://www.runoob.com/jqueryui/jqueryui-tutorial.html
  6. jquery的说明参考:http://www.w3school.com.cn/jquery/index.asp
  7. tabs-api为横向的标签,下面定义的div比如tabs-purchase是竖向的标签,按已有的往下添加,名字别重复就行。
  8. 新增横向标签:
  9. 1. <div id="tabs-api"><ul><li>下面新加个a标签,指向一个锚点。
  10. 2. 上一条的<ul>同级别下新加一个<div>,id使用上一条锚点指定的id。
  11. 新增纵向标签:
  12. 1. js加一行,设置纵向标签的参数。
  13. 2. 总之参考已有的样例吧。
  14. -->
  15. <head>
  16. <meta charset="utf-8">
  17. <title>网关产品示例</title>
  18. <link rel="stylesheet" href="static/jquery-ui.min.css">
  19. <script src="static/jquery-1.11.2.min.js"></script>
  20. <script src="static/jquery-ui.min.js"></script>
  21. <script src="static/demo.js"></script>
  22. <script>
  23. $(function() {
  24. setApiDemoTabs("#tabs-purchase");
  25. setApiDemoTabs("#tabs-preauth");
  26. });
  27. </script>
  28. <link rel="stylesheet" href="static/demo.css">
  29. </head>
  30. <body style="background-color:#e5eecc;">
  31. <div id="wrapper">
  32. <div id="header">
  33. <h2>网关产品示例</h2>
  34. </div>
  35. <div id="tabs-api">
  36. <ul>
  37. <li><a href="#tabs-api-1">前言</a></li>
  38. <li><a href="#tabs-api-2">消费样例</a></li>
  39. <li><a href="#tabs-api-3">预授权样例</a></li>
  40. <li><a href="#tabs-api-4">常见开发问题</a></li>
  41. </ul>
  42. <div id="tabs-api-1">
  43. <?php include 'pages/api_01_gateway/introduction.php';?>
  44. </div>
  45. <div id="tabs-api-4">
  46. <?php include 'pages/dev_faq.php';?>
  47. </div>
  48. <div id="tabs-api-2">
  49. <div id="tabs-purchase">
  50. <ul>
  51. <li><a href="#tabs-purchase-1">说明</a></li>
  52. <li><a href="pages/api_01_gateway/consume.php">跳转网关页面支付</a></li>
  53. <li><a href="pages/api_01_gateway/query.php">交易状态查询</a></li>
  54. <li><a href="pages/api_01_gateway/consume_undo.php">消费撤销</a></li>
  55. <li><a href="pages/api_01_gateway/refund.php">退货</a></li>
  56. <li><a href="pages/api_01_gateway/file_transfer.php">对账文件下载</a></li>
  57. </ul>
  58. <div id="tabs-purchase-1">
  59. <?php include 'pages/api_01_gateway/consume_intro.php';?>
  60. </div>
  61. </div>
  62. </div>
  63. <div id="tabs-api-3">
  64. <div id="tabs-preauth">
  65. <ul>
  66. <li><a href="#tabs-preauth-1">说明</a></li>
  67. <li><a href="pages/api_01_gateway/preauth.php">跳转网关页面预授权</a></li>
  68. <li><a href="pages/api_01_gateway/query.php">交易状态查询</a></li>
  69. <li><a href="pages/api_01_gateway/preauth_finish.php">预授权完成</a></li>
  70. <li><a href="pages/api_01_gateway/preauth_undo.php">预授权撤销</a></li>
  71. <li><a href="pages/api_01_gateway/preauth_finish_undo.php">预授权完成撤销</a></li>
  72. <li><a href="pages/api_01_gateway/refund.php">退货</a></li>
  73. <li><a href="pages/api_01_gateway/file_transfer.php">对账文件下载</a></li>
  74. </ul>
  75. <div id="tabs-preauth-1">
  76. <?php include 'pages/api_01_gateway/preauth_intro.php';?>
  77. </div>
  78. </div>
  79. </div> <!-- end of tabs-api-3-->
  80. </div> <!-- end of tabs-api-->
  81. </div><!-- end of wrapper-->
  82. </body>
  83. </html>