personal.html 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
  6. <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
  7. <meta name="format-detection"content="telephone=no">
  8. <title>index</title>
  9. <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
  10. <link rel="stylesheet" type="text/css" href="../../css/style.css"/>
  11. <link rel="stylesheet" href="../../css/projeck.css">
  12. <style media="screen">
  13. body,html{
  14. margin: 0;
  15. background: #fff;
  16. }
  17. </style>
  18. </head>
  19. <body>
  20. <div class="api_layout">
  21. <header class="header-login">
  22. <img class="backBtn" src="../../image/btn_back.png" alt="" tapmode onclick="backIndex()">
  23. <p class="api_text">个人资料</p>
  24. </header>
  25. <div class="api_nav">
  26. <div class="header-nav scroller nav-haohuo" id="navScroll">
  27. <ul class="header-nav-items flex-wrap">
  28. <li class="active flex-con" tapmode="active" onclick="randomSwitchBtn(this)">
  29. 基本信息
  30. </li>
  31. <li class="flex-con" tapmode="active" onclick="randomSwitchBtn(this)">
  32. 初始学历
  33. </li>
  34. <li class="flex-con" tapmode="active" onclick="randomSwitchBtn(this)">
  35. 最高学历
  36. </li>
  37. </ul>
  38. </div>
  39. </div>
  40. </div>
  41. </body>
  42. </html>
  43. <script type="text/javascript" src="../../script/api.js"></script>
  44. <script type="text/javascript">
  45. apiready = function () {
  46. $api.fixStatusBar($api.dom('header') );
  47. api.parseTapmode();
  48. var info = $api.getStorage('data'),
  49. token = JSON.parse(info).data.access_token;
  50. funIniGroup(token);
  51. }
  52. var eHeaderLis;
  53. function funIniGroup(token){
  54. eHeaderLis = $api.domAll('.header-nav-items li'),
  55. frames = [];
  56. for (var i = 0,len = eHeaderLis.length; i < len; i++) {
  57. frames.push( {
  58. name: 'personal_frame'+i,
  59. url: 'personal_frame'+i+'.html',
  60. bgColor : '#f2f2f2',
  61. bounces:true,
  62. pageParam:{
  63. data:token
  64. },
  65. } )
  66. }
  67. api.openFrameGroup({
  68. name: 'group',
  69. scrollEnabled: true,
  70. rect: {
  71. x: 0,
  72. y: $api.dom('header').offsetHeight+$api.dom('.api_nav').offsetHeight,
  73. w: api.winWidth,
  74. h: $api.winHeight
  75. },
  76. preload:0,
  77. index: 0,
  78. frames: frames
  79. }, function (ret, err) {
  80. menuSelected(ret.index);
  81. });
  82. };
  83. function menuSelected(index) {
  84. for (var i = 0; i < eHeaderLis.length; i++) {
  85. if(index == i ){
  86. $api.addCls(eHeaderLis[i], 'active');
  87. }else {
  88. $api.removeCls(eHeaderLis[i], 'active');
  89. }
  90. }
  91. }
  92. function randomSwitchBtn( tag ) {
  93. if( tag == $api.dom('.header-nav-items li.active') )return;
  94. var eFootLis = $api.domAll('.header-nav-items li');
  95. index = 0;
  96. for (var i = 0,len = eFootLis.length; i < len; i++) {
  97. if( tag == eFootLis[i] ){
  98. index = i;
  99. }else{
  100. $api.removeCls(eFootLis[i], 'active');
  101. }
  102. }
  103. $api.addCls( eFootLis[index], 'active');
  104. api.setFrameGroupIndex({
  105. name: 'group',
  106. index: index
  107. });
  108. }
  109. function backIndex() {
  110. api.sendEvent({
  111. name: 'userInfo',
  112. extra: {
  113. key1: 'value1',
  114. key2: 'value2'
  115. }
  116. });
  117. api.closeWin();
  118. }
  119. </script>