標籤：實現 query 下載 input style 需求 1.7 test round
項目案例需求如，輸入/綁定正確的手機號才能下載軟體，輸入手機號發送驗證碼的功能等；
如下代碼可以實現準系統：
<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <style> .gray-btn{ background: #ccc; } .blue-btn{ background: #09f; } </style></head><body><input type="tel" name="mobile" id="getNum" value="" placeholder="填寫手機號碼" autocomplete=‘off‘/><input type="button" name="button" class="gray-btn downloadBtn" value="去下載**APP" disabled/><script src="jquery-1.7.2.min.js"></script><script> //監聽輸入手機號 $(document).on(‘input propertychange‘,‘#getNum‘,function (e) { if (e.type === "input" || e.orignalEvent.propertyName === "value") { if(this.value.length == 11){ var myreg = /^1\d{10}$/; if(!myreg.test(this.value)){ common.tips({msg:‘請輸入正確手機號‘}); return; } $(‘.downloadBtn‘).removeClass(‘gray-btn‘).addClass(‘blue-btn‘); $(‘.downloadBtn‘).attr("disabled", false); }else{ $(‘.downloadBtn‘).addClass(‘gray-btn‘).removeClass(‘blue-btn‘); $(‘.downloadBtn‘).attr("disabled", true); } } })</script></body></html>
移動端監聽輸入手機號以及判斷手機號有效
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
