三種方法使用jquery獲取驗證碼倒計時，并設(shè)置防重復(fù)點擊
<div class="root">




<button class="btn">獲取驗證碼1</button>




<button class="btn1">獲取驗證碼2</button>


<button class="btn3">獲取驗證碼3</button>
</div>
<script type="text/javascript">
// 一 利用綁定和解綁點擊事件
let time1 = 10;
var count = time1;
var countinterval;
var button = $('.btn');
button.click(showTitle);
function showTitle(){
console.log(00000);
countinterval = setInterval(timecount, 1000);
button.off('click',showTitle);//解綁點擊事件
}
function timecount(){
button.text(count+'s');
if (count<=0) {
count = time1;
clearInterval(countinterval);
button.text('重新獲取驗證碼');
button.on('click',showTitle);
}
else
count--;
}
//二 設(shè)置disabled屬性
let time2 = 15;//15s
var count1 = time2;
var countinterval2;
var button2 = $('.btn1');
button2.click(showtitle2);
function showtitle2(){
console.log(11111);
// button2.off();
countintervalt = setInterval(timecount1,1000);
button2.attr('disabled',true);
}
function timecount1(){
button2.text(count1+'s');
if (count1<=0) {
count1 = time2;
clearInterval(countintervalt);
button2.text('重新獲取驗證碼');
button2.attr('disabled',false);
}
else
count1--;
}
//三 加標(biāo)識
let time3 = 20;//15s
var canclick=true;
var count2 = time3;
var countinterval3;
var button3 = $('.btn3');
button3.click(showtitle3);
function showtitle3(){
if (canclick) {
console.log(11111);
countinterval3 = setInterval(timecount2,1000);
canclick = false;
}
}
function timecount2(){
button3.text(count2+'s');
if (count2<=0) {
count2 = time3;
clearInterval(countinterval3);
button3.text('重新獲取驗證碼');
canclick = true;
}
else
count2--;
</script>