modify_mobile.html 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123
  1. {extend name="default/base/base_member" /}
  2. {block name="member_main"}
  3. <div class="alert alert-success">
  4. <h4>{$Think.lang.operating_hints}:</h4>
  5. <ul>
  6. <li>{$Think.lang.verify_mobile_prompt1}</li>
  7. <li>{$Think.lang.verify_mobile_prompt2}</li>
  8. <li>{$Think.lang.verify_mobile_prompt3}</li>
  9. </ul>
  10. </div>
  11. <div class="dsm-default-form">
  12. <form method="post" id="mobile_form" action="{:url('Membersecurity/modify_mobile')}">
  13. <dl>
  14. <dt><i class="required">*</i>{$Think.lang.bind_mobile_phone_number}:</dt>
  15. <dd>
  16. <p>
  17. <input type="text" class="text" maxlength="11" value="" name="mobile" id="mobile" />
  18. <label for="mobile" generated="true" class="error"></label>
  19. <a href="javascript:void(0);" id="send_auth_code" class="dsm-btn ml5"><span id="sending" style="display:none">{$Think.lang.binding_validation_information1}</span><span class="send_success_tips"><strong id="show_times" class="red mr5"></strong>{$Think.lang.binding_validation_information2}</span>{$Think.lang.binding_validation_information3}</a></p>
  20. <p class="send_success_tips hint mt10">{$Think.lang.binding_validation_information4}<strong>{$Think.lang.binding_validation_information5}</strong>{$Think.lang.binding_validation_information6}</p>
  21. </dd>
  22. </dl>
  23. <dl>
  24. <dt><i class="required">*</i>{$Think.lang.binding_validation_information7}:</dt>
  25. <dd>
  26. <input type="text" class="text" maxlength="6" value="" name="vcode" id="vcode" />
  27. <label for="vcode" generated="true" class="error"></label>
  28. </dd>
  29. </dl>
  30. <dl class="bottom">
  31. <dt>&nbsp;</dt>
  32. <dd>
  33. <input type="submit" class="submit" value="{$Think.lang.immediately_binding}" />
  34. </dd>
  35. </dl>
  36. </form>
  37. </div>
  38. <script type="text/javascript">
  39. $('.send_success_tips').hide();
  40. var ALLOW_SEND = true;
  41. $(function() {
  42. function StepTimes() {
  43. $num = parseInt($('#show_times').html());
  44. $num = $num - 1;
  45. $('#show_times').html($num);
  46. if ($num <= 0) {
  47. ALLOW_SEND = !ALLOW_SEND;
  48. $('.send_success_tips').hide();
  49. } else {
  50. setTimeout(StepTimes, 1000);
  51. }
  52. }
  53. $('#send_auth_code').on('click', function() {
  54. if ($('#mobile').val() == '')
  55. {
  56. layer.alert('{$Think.lang.enter_mobile_phone_number}');
  57. return false;
  58. }
  59. if (!ALLOW_SEND)
  60. return;
  61. ALLOW_SEND = !ALLOW_SEND;
  62. $('#sending').show();
  63. $.getJSON(HOMESITEURL + '/Membersecurity/send_modify_mobile.html', {mobile: $('#mobile').val()}, function(data) {
  64. if (data.state == 'true') {
  65. $('#sending').hide();
  66. $('.send_success_tips').show();
  67. $('#show_times').html(60);
  68. setTimeout(StepTimes, 1000);
  69. } else {
  70. ALLOW_SEND = !ALLOW_SEND;
  71. $('#sending').hide();
  72. $('.send_success_tips').hide();
  73. layer.alert(data.msg);
  74. }
  75. });
  76. });
  77. $('#mobile_form').validate({
  78. submitHandler: function(form) {
  79. ds_ajaxpost('mobile_form','url',"{:url('Membersecurity/index')}")
  80. },
  81. rules: {
  82. mobile: {
  83. required: true,
  84. maxlength: 11,
  85. minlength: 11,
  86. digits: true
  87. },
  88. vcode: {
  89. required: true,
  90. maxlength: 6,
  91. minlength: 6,
  92. digits: true
  93. }
  94. },
  95. messages: {
  96. mobile: {
  97. required: '<i class="iconfont">&#xe64c;</i>{$Think.lang.input_mobile_verification_number}',
  98. maxlength: '<i class="iconfont">&#xe64c;</i>{$Think.lang.input_mobile_verification_number}',
  99. minlength: '<i class="iconfont">&#xe64c;</i>{$Think.lang.input_mobile_verification_number}',
  100. digits: '<i class="iconfont">&#xe64c;</i>{$Think.lang.input_mobile_verification_number}'
  101. },
  102. vcode: {
  103. required: '<i class="iconfont">&#xe64c;</i>{$Think.lang.input_mobile_verification_code}',
  104. maxlength: '<i class="iconfont">&#xe64c;</i>{$Think.lang.input_mobile_verification_code}',
  105. minlength: '<i class="iconfont">&#xe64c;</i>{$Think.lang.input_mobile_verification_code}',
  106. digits: '<i class="iconfont">&#xe64c;</i>{$Think.lang.input_mobile_verification_code}'
  107. }
  108. }
  109. });
  110. });
  111. </script>
  112. {/block}