如何防止多次點擊一個錨標籤按鈕

我有一個錨標籤（即取消按鈕）在jsp文件中具有class屬性和href屬性。如何防止多次點擊一個錨標籤按鈕

我已經寫了一個onclick事件的類屬性在一個單獨的js文件。所以當按鈕被點擊時，onclick事件就會執行，然後進入href鏈接。

當多次單擊按鈕時，會將我帶到空白頁面或錯誤頁面。

我想阻止多個點擊按鈕。

我已經嘗試在我的onclick()函數中使用event.preventdefault()函數，但如果我這樣做，href鏈接不起作用。還有其他方法嗎？

我的JS代碼：

$('.cancel-btn').on('click',function(evt){ 
      //evt.preventDefault(); 
      //My Code    

     });

來源

2017-07-08 JokerBean

看一看到的jsfiddle https://jsfiddle.net/w2wnuyv6/1/ – Shiladitya

jQuery的one()方法使用執行click事件只有一次

$('.cancel-btn').one('click',function(evt){ 
    //evt.preventDefault(); 
    //Code here    
});

也有可能jQuery的on()方法

var count = 0; 
$('.cancel-btn').on('click',function(evt){ 
    if (count == 0) { 
     count++; 
     //code here 
    } else { 
     return false; 
    } 
});

來源

2017-07-08 06:44:20

[jQuery的一個（）方法（HTTPS：//www.w3schools。 com/jquery/event_one.asp） –

很好的答案！「（鏈接到源代碼）（http://api.jquery.com/one/）總是比較好，並直接在後面提供相關的詳細信息 - 」'.one（）'和'.on（） '除非處理程序在第一次調用後被解除綁定。「 – wahwahwah

@RohitSharma嘗試使用one（）方法，但你的第二個答案適用於我:) ..我在else類中使用了preventDefault（）而不是返回false。非常感謝您的幫助。 – JokerBean

嘗試使用布爾標誌確保該功能只執行一次

var executeOnce = false; 
$('.cancel-btn').on('click',function(evt){ 
    if(!executeOnce){ 
    //evt.preventDefault(); 
    //My Code 
    executeOnce = true; 
    }  
});

來源

2017-07-08 06:47:08

在這裏你有另一種方式去做使用指針的事件沒有 https://jsfiddle.net/w2wnuyv6/1/

$('a[value="cancel"]').click(function(){ 
    $(this).css({ 
     'pointer-events': 'none' 
    }); 
});

來源

2017-07-08 06:53:16 Shiladitya

有趣而簡單的方法。我今天學到了東西！ – Armfoot

你可以寫這樣的功能是：

function clickOnce (element ,listener){ 
    element.addEventListener("click", function (event){ 
     listener(event); 
     element.removeEventListener("click", arguments.callee); 
    }); 
}

jsfiddle

來源

2017-07-08 07:37:23 Julien

正如你所提到的，事件是寫在那class，你可以使用這個簡單的代碼，以確保其點擊一次：

$('.cancel-btn').on('click', function(evt) { 
    // execue your code 
    $(this).removeClass('cancel-btn'); 
});

這個代碼從DOM刪除類，因此click事件永遠不會被解僱。

可選，您可以使用off()刪除的事件，像這樣：

$(".cancel-button").off("click");

這將刪除綁定到該元素的所有點擊事件。在你的代碼，它會像：

$('.cancel-btn').on('click', function(evt) { 
     // execue your code 
     $(this).off("click"); 
    });

來源

2017-07-09 06:38:45

如何防止多次點擊一個錨標籤按鈕

回答

相關問題