js防止多次點擊

⑴ 怎樣使js中的onclick事件只觸發一次,就是我點擊了一次，再次點擊的時候不讓其再觸發

解決的方法：

1、用jQuery的方式

jQuery專門為此功能提供了一個函數one。這樣寫就能讓click這個事件只執行一次。

$("#btn3").one('click',function(){

alert('jQuey的one函數，第1次點擊');

});

(1)js防止多次點擊擴展閱讀：

jQuery的模塊可以分為3部分：入口模塊、底層支持模塊和功能模塊。

在構造jQuery對象模塊中，如果在調用構造函數jQuery()創建jQuery對象時傳入了選擇器表達式，則會調用選擇器Sizzle遍歷文檔，查找與之匹配的DOM元素，並創建一個包含了這些DOM元素引用的jQuery對象。

瀏覽器功能測試模塊提供了針對不同瀏覽器功能和bug的測試結果，其他模塊則基於這些測試結果來解決瀏覽器之間的兼容性問題。

在底層支持模塊中，回調函數列表模塊用於增強對回調函數的管理，支持添加、移除、觸發、鎖定、禁用回調函數等功能；

非同步隊列模塊用於解耦非同步任務和回調函數，它在回調函數列表的基礎上為回調函數增加了狀態，並提供了多個回調函數列表，支持傳播任意同步或非同步回調函數的成功或失敗狀態；

數據緩存模塊用於為DOM元素和javascript對象附加任意類型的數據；隊列模塊用於管理一組函數，支持函數的入隊和出隊操作，並確保函數按順序執行，它基於數據緩存模塊實現。

⑵ Html js禁止整個頁面所有點擊

Htmljs禁止整個頁面所有點擊可以添加標記,第一次點擊後變為false,每次點擊判斷這個標記是true才執行。
如果是按鈕防止重復點擊，可以再按鈕點擊後，給按鈕添加disabled屬性。
JavaScript一種直譯式腳本語言，是一種動態類型、弱類型、基於原型的語言，內置支持類型。
它的解釋器被稱為JavaScript引擎，為瀏覽器的一部分，廣泛用於客戶端的腳本語言，最早是在HTML（標准通用標記語言下的一個應用）網頁上使用，用來給HTML網頁增加動態功能。
JavaScript是一種基於對象和事件驅動並具有相對安全性的客戶端腳本語言。同時也是一種廣泛用於客戶端Web開發的腳本語言，常用來給HTML網頁添加動態功能，比如響應用戶的各種操作。

⑶ js怎麼避免click短時間的多次執行

比如樓下說的方法，可以設置變數來，或者再標簽上加自己定義屬性，示例如下：

<inputtype="button"value="測試"state="0"id="btn"/>
<scripttype="text/javascript">
//JS的做法,當然下面的也可以把點擊時間做成函數，然後添加到空間上面
document.getElementById("btn").onclick=function(){
//獲取按鈕點擊狀態
vars=this.getAttribute("state");
if(s=='1'){
alert("系統處理中，請不要重復點擊！");
}else{
//設置點擊狀態，執行業務邏輯，設置處理中
this.setAttribute("state","1")
}
//下方寫你的其他代碼

this.setAttribute("state","0");//設置點擊狀態，執行完成清空點擊
}
//jQuery的做法
$("#btn").click(function(){
//獲取按鈕點擊狀態
vars=$(this).attr("state");
if(s=='1'){
alert("系統處理中，請不要重復點擊！");
}else{
//設置點擊狀態，執行業務邏輯，設置處理中
$(this).attr("state","1")
}
//下方寫你的其他代碼

$(this).attr("state","0");//設置點擊狀態，執行完成清空點擊
});
</script>

⑷ html、js輪播圖怎麼阻止快速、多次點擊造成的混亂

古老的做法是用settimeout或者setinterval實現循環動畫，但是這樣就會造成題主說的，在且頁面的時候會造成混亂。

因為當頁面失去焦點時瀏覽器不再渲染頁面，但是settimeout/setinterval的請求不會停止，隊列會一直堆積動畫，當頁面再次獲得焦點時動畫隊列早已堆積了大量命令，就會導致動畫混亂。

現在的做法，籠統地說，是使用requestanimationframe函數，用法和settimeout/setinterval類似，只不過requestanimationframe不接受時間參數,函數的執行頻率由瀏覽器的渲染幀數決定，這就實現了由瀏覽器決定動畫隊列，避免了動畫混亂。當然也可以使用一些現成的輪播圖插件，題主可以自己網路，這里對比舉例說明一下settimeout和requestanimationframe的用法。

//用setTimeout實現在控制台循環輸出helloworld
functionfun(){
console.log('helloworld');
setTimeout(function(){
fun();
},3000);
}
fun();//執行fun函數，就可以每隔3000毫秒遞歸的輸出helloworld


//用reqestanimationframe實現在控制台循環輸出helloworld
functionfun(){
console.log('helloworld');
requestAnimationFrame(function(){
fun();
})
}
fun()//執行fun函數，就可以每隔3000毫秒遞歸的輸出helloworld


//requestAnimationFrame沒有時間參數，所以直接使用不能控制間隔
//但我們可以人為的限制執行間隔，方法如下
functionfun(last_time){
if(newDate().getTime()-last_time>3000){
console.log('helloworld');
requestAnimationFrame(function(){
fun(newDate().getTime());
})
}else{
requestAnimationFrame(function(){
fun(last_time)
});
}
}
fun(newDate().getTime())
//這樣就可以為requestAnimationFrame設置間隔，實現每隔3000毫秒輸出helloworld
//抱歉我主寫c副寫python偶爾寫javaweb,分號用的有些亂。

⑸ Js中防抖和節流的區別，論如何避免重復點擊

在進行窗口的resize、scroll，輸入框內容校驗，防止按鈕重復點擊等操作時，如果事件處理函數調用的頻率無限制，會加重瀏覽器的負擔，體驗糟糕。所以可以採用debounce（防抖）和throttle（節流）的方式來減少調用頻率，同時又不影響實際效果。
我們一起先來看看防抖和節流的區別

防抖函數 debounce

節流函數 throttle

如何調用

防抖和節流都利用了閉包，首先就調用了debounce和debounce方法，把內部的方法返回出去，下次自己執行，以後有時間我再寫一下閉包吧，所以我還留下一個問題，這樣會不會造成內存泄漏？

⑹ 前端js防止用戶惡意操作，重復點擊按鈕事件

前幾天遇到了一個關於前端重復點擊事件問題，防止用戶惡意操作，重復點擊按鈕事件，有二個邏輯解決此問題：

1.

2.定義變數保存每次點擊的時間，上次和當前次點擊的時間間隔小於某個時間，就return掉，否則就繼續之後步驟，類似於

this.state={ clickTime:new Date().getTime()}

  buyCard(){ 

   var {clickTime} =this.state;

    var nowTime = new Date().getTime();

     if( clickTime != 'undefined'&& (nowTime - clickTime < 500)){

               return false;

     }else{

        this.setSate({clickTime:nowTime})

        .....

     }       

}