edit-profile-sms-edit.html 8.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182
  1. <!DOCTYPE html>
  2. <html lang=zh-cn>
  3. <head>
  4. <meta charset=utf-8>
  5. <title>纵横计量支付系统</title>
  6. <meta name=description content=计量支付>
  7. <meta name=copyright content=smartcost.com.cn>
  8. <link rel=stylesheet href="{{rootUrl}}global/css/bootstrap.css">
  9. <link rel=stylesheet href={{rootUrl}}global/css/style.css>
  10. <script src={{rootUrl}}global/js/jquery-1.9.1.min.js></script>
  11. <script src={{rootUrl}}global/js/bootstrap.js></script>
  12. <script src={{rootUrl}}global/js/jl.js></script>
  13. <script src={{rootUrl}}global/js/jquery.cookie.min.js></script>
  14. </head>
  15. <body>
  16. <!-- include "top" -->
  17. <div class="wrapContent">
  18. <!-- include "left" -->
  19. <div class="mainContainer">
  20. <!--内容-->
  21. <div class="mainContent">
  22. <div class="title clearfix">
  23. <div class="fR">
  24. <a class="btn btn-link" href="http://smartcost.com.cn/product/19" target="_blank"><i class="icon-question-sign"></i>&nbsp;帮助</a>
  25. </div>
  26. </div>
  27. <div class="form">
  28. <div class="form-horizontal">
  29. <legend>短信通知-修改手机</legend>
  30. <div class="form-group">
  31. <label class="col-sm-1 control-label">当前手机</label>
  32. <div class="col-sm-2">
  33. <input class="form-control" type="text" placeholder="{{uprofile.mobile}}" disabled="">
  34. </div>
  35. </div>
  36. <div id="input_error" class="form-group">
  37. <label class="col-sm-1 control-label">新手机</label>
  38. <div class="col-sm-2">
  39. <input class="form-control" id="mobile" name="mobile" type="text" placeholder="输入您的新手机号码"><span id="help-inline"
  40. class="help-block" style="display: none"></span>
  41. </div>
  42. </div>
  43. <div id="code_error" class="form-group">
  44. <label class="col-sm-1 control-label">短信校验码</label>
  45. <div class="col-sm-2">
  46. <input class="form-control" type="text" id="verifycode" name="verifycode" placeholder="输入验证码" maxlength="11"
  47. class="span2">
  48. <span id="help-inline2"
  49. class="help-block" style="display: none"></span>
  50. <!--<button class="btn">获取验证码</button>-->
  51. <!--<button class="btn" disabled>重新获取 60s</button>-->
  52. </div>
  53. <div class="col-sm-2">
  54. <input type="button" class="btn btn-default" id="getting" value="获取验证码">
  55. </div>
  56. </div>
  57. <div class="form-group">
  58. <label class="col-sm-1 control-label"></label>
  59. <div class="col-sm-2">
  60. <i class="icon-ok icon-white"></i><input type="button" id="addMobile"
  61. class="btn btn-primary" value="确定修改"/>
  62. </div>
  63. </div>
  64. </fieldset>
  65. </div>
  66. </div>
  67. </div>
  68. <!--内容-->
  69. </div>
  70. </div>
  71. <script type="text/javascript">autoFlashHeight();</script>
  72. <script type="text/javascript">
  73. $(document).ready(function () {
  74. $("#mobile").blur(function () {
  75. $.ajax({
  76. type: "POST",
  77. dataType: "json",
  78. cache: false,
  79. data: {"mobile": $(this).val()},
  80. url: "{{rootUrl}}user/profile/check/mobile"
  81. }).done(function (data) {
  82. if (data['mobile'] > 0) {
  83. $("#input_error").addClass('has-error');
  84. $("#help-inline").html('手机号码已被使用');
  85. $("#help-inline").show();
  86. } else {
  87. $("#input_error").removeClass('has-error');
  88. $("#help-inline").hide();
  89. }
  90. });
  91. });
  92. /*仿刷新:检测是否存在cookie*/
  93. if ($.cookie("sms")) {
  94. var count = $.cookie("sms");
  95. var btn = $('#getting');
  96. btn.val('重新获取 ' + count + 's').attr('disabled', true).css('cursor', 'not-allowed');
  97. var resend = setInterval(function () {
  98. count--;
  99. if (count > 0) {
  100. btn.val('重新获取 ' + count + 's').attr('disabled', true).css('cursor', 'not-allowed');
  101. $.cookie("sms", count, {path: '/', expires: (1 / 86400) * count});
  102. } else {
  103. clearInterval(resend);
  104. btn.val("获取验证码").removeClass('disabled').removeAttr('disabled style');
  105. }
  106. }, 1000);
  107. }
  108. /*点击改变按钮状态,已经简略掉ajax发送短信验证的代码*/
  109. $('#getting').click(function () {
  110. var btn = $(this);
  111. if ($("#mobile").val() == '') {
  112. $("#input_error").addClass('has-error');
  113. $("#help-inline").html('手机号码不能为空');
  114. $("#help-inline").show();
  115. return false;
  116. }
  117. $.ajax({
  118. type: "POST",
  119. dataType: "json",
  120. cache: false,
  121. data: {"mobile": $("#mobile").val()},
  122. url: "{{rootUrl}}user/profile/check/mobile"
  123. }).done(function (data) {
  124. if (data['mobile'] > 0) {
  125. $("#input_error").addClass('has-error');
  126. $("#help-inline").html('手机号码已被使用');
  127. $("#help-inline").show();
  128. return false;
  129. } else {
  130. $("#input_error").removeClass('has-error');
  131. $("#help-inline").hide();
  132. $.ajax({
  133. type: "POST",
  134. dataType: "json",
  135. cache: false,
  136. data: {"mobile": $("#mobile").val()},
  137. url: "{{rootUrl}}user/profile/sms/send/verify"
  138. }).done(function (data) {
  139. });
  140. var count = 60;
  141. var resend = setInterval(function () {
  142. count--;
  143. if (count > 0) {
  144. btn.val('重新获取 ' + count + 's');
  145. $.cookie("sms", count, {path: '/', expires: (1 / 86400) * count});
  146. } else {
  147. clearInterval(resend);
  148. btn.val("获取验证码").removeAttr('disabled style');
  149. }
  150. }, 1000);
  151. btn.attr('disabled', true).css('cursor', 'not-allowed');
  152. }
  153. });
  154. });
  155. /*点击改变按钮状态,已经简略掉ajax发送短信验证的代码*/
  156. $('#addMobile').click(function () {
  157. $.ajax({
  158. type: "POST",
  159. dataType: "json",
  160. cache: false,
  161. data: {"mobile": $("#mobile").val(), "verifycode": $("#verifycode").val()},
  162. url: "{{rootUrl}}user/profile/sms/edit",
  163. success: function(result){
  164. if(result.code == 400){
  165. $("#code_error").addClass('has-error');
  166. $("#help-inline2").html('短信校验码有误');
  167. $("#help-inline2").show();
  168. }else{
  169. $("#code_error").removeClass('has-error');
  170. $("#help-inline2").hide();
  171. window.location.href = '/user/profile/sms/edit';
  172. }
  173. }
  174. });
  175. });
  176. });
  177. </script>
  178. </body>