html:html
<input name="Tel" class="weui-input" type="tel" placeholder="請輸入手機號">
<button type="button" class="weui-vcode-btn" onclick="getCode(this)">獲取驗證碼</button>
js:ajax
<script> /*獲取驗證碼*/ function getCode(obj) { if (checkPhone()) {//驗證手機號碼 $.ajax({ type: "POST", url: '@Url.Action("SendVerifyCode", "Account")', data: { Tel: $("input[name='Tel']").val() }, success: function (result) { if (result.Success) { } else { $.toptip(result.ErrorMessage, 'error'); } }, error: function (result) { $.toptip('未知異常致使請求失敗,請重試.', 'error'); } }); settime(obj); //倒計時 } else { $("input[name='Tel']").focus(); return; } } //驗證手機號碼 function checkPhone() { var phone = $("input[name='Tel']").val(); var pattern = /^1[0-9]{10}$/; if (phone.length == 0) { //alert('請輸入手機號碼'); $.toptip("請輸入手機號碼", 'error'); return false; } if (!pattern.test(phone)) { //alert('請輸入正確的手機號碼'); $.toptip("手機號格式錯誤", 'error'); return false; } return true; } var countdown = 60; function settime(obj) { if (countdown == 0) { $(obj).removeAttr("disabled"); $(obj).text("獲取驗證碼"); countdown = 60; return; } else { $(obj).attr("disabled", true); $(obj).text(countdown +'s'+'後重發'); countdown--; } setTimeout(function () { settime(obj) }, 1000) } </script>