按鈕不斷只觸發一次

Question

如果繼續點擊相同的按鈕，則只會觸發一次。示例：https://jsfiddle.net/h4wgxofh/，例如，如果click1點擊，則第二次或多次點擊應該停止點擊，但與click2相同，但是，如果我點擊相同的按鈕，它總是會觸發。另外我希望鏈接只觸發一次，但如果其他按鈕被點擊則變爲可用。 （考慮如果多個按鈕）謝謝

HTML

<div class="wrap"> 
    <a href="#">Click1</a> 
    <a href="#">Click2</a> 
</div> 

腳本

var clicked = false; 

$('.wrap').on('click', 'a', function(){ 
    var $this = $(this); 
    clicked = true; 

    if(clicked = true){ 
    console.log($this.text()); 
    clicked = false; 
    } 
}); 

Answer 1

我可能失去了一些東西在這裏，但爲什麼不只是事件綁定到每一個環節中.wrap和解除綁定的點擊這樣的：

$('.wrap a').on('click', function(){  
    console.log($(this).text()); 
    $(this).unbind('click'); 
}); 

看到這個fiddle

編輯：後在想一個鏈接您的評論是反彈cliking另一個之後，即使它可能不是最乾淨的解決方案，這樣做的工作：

var onclick = function(){ 
    var $el = $(this); 
    console.log($el.text()); 
    $('.wrap a').off('click', onclick); 
    $('.wrap a').each(function(id, link){ 
     if($el.text() != $(link).text()) 
      $(link).on('click', onclick); 
    }); 
} 

$('.wrap a').on('click', onclick); 

Fiddle again

Answer 2

只需使用$(".wrap").one('click', ....

閱讀jQuery的API文檔。

Answer 3

每次點擊一個按鈕，你的腳本設置從點擊到falsetrue，檢查是否值是true，然後重新設置爲false。你需要這樣的格式，如果你只想要的按鈕來觸發一次（很明顯，你不得不專門複製此爲具有不同ID的每個按鈕）：

var clicked = false; 

$('.wrap').on('click', 'a', function(){ 
    var $this = $(this); 

    if(clicked == false){ 
    console.log($this.text()); 
    clicked = true; 
    } 
}); 

Answer 4

請看下面的代碼

var clicked1 = false; 
 
var clicked2 = false; 
 

 
$('.wrap').on('click', 'a', function(){ 
 
\t var $this = $(this); 
 
    \t var clickOrigin = $(this).text(); 
 
\t 
 
    \t if(clickOrigin == 'Click1' && clicked1==false){ 
 
    \t console.log("Click 1 clicked"); 
 
    \t clicked1 = true; 
 
\t } 
 
\t if(clickOrigin == 'Click2' && clicked2==false){ 
 
    \t console.log("Click 2 clicked"); 
 
    \t clicked2 = true; 
 
\t } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="wrap"> 
 
    <a href="#">Click1</a> 
 
    <a href="#">Click2</a> 
 
</div>

你

還可以找到jsFiddle。

Answer 5

要禁用第一次點擊後兩個按鈕，嘗試：

var clicked = false; 

$('.wrap').on('click', 'a', function(){ 
    let $this = $(this); 

    if(!clicked){ 
    console.log($this.text()); 
    clicked = true; 
    }; 
}); 

先禁用後點擊每個按鈕，嘗試：

$('.wrap a').each(function() { 
    let $this = $(this); 
    $this.disabled = false; 
    $this.on('click', function() { 
    if (!$this.disabled) { 
     console.log($this.text()); 
     $this.disabled = true; 
    }; 
    }); 
}); 

Answer 6

試試這個，要簡單得多，這將是如果有更多的有用你有多個點擊按鈕

如果你已經實施了其他方式，這將是值得一試

 <div class="wrap"> 
     <a href="#" data-value="">Click1</a> 
     <a href="#" data-value="">Click2</a> 
    </div> 

    $('.wrap').on('click', 'a', function(){ 
     var $this = $(this); 

     if($this.attr("data-value") == ""){ 
     console.log($this.text()); 
     $this.attr("data-value","clicked") 
     } 
     else{ 
     console.log("Already clicked") 
     } 
    }); 

Fiddle

Answer 7

你需要兩個環節來區分（我用文字在這裏你可以將任何情況下）看到這個例子中，它可以幫助： -

var clicked1 = 0; 
var clicked2 = 0; 

$('.wrap').on('click', 'a', function() { 
    var $this = $(this); 
    var $text = $(this).text(); 
    //Click2 
    if ($text == 'Click1') { 
    clicked1 += 1; 
    if (clicked1 == 1) { 
     console.log($text); 
    } else { 
     return; 
    } 
    } 
    //Click2 
    if ($text == 'Click2') { 
    clicked2 += 1; 
    if (clicked2 == 1) { 
     console.log($text); 
    } else { 
     return; 
    } 
    } 
}); 

完全Demo

Answer 8

相反將代碼放在點擊上只需第一次點擊禁用錨點標記這服務於同樣的事情，你想只需找到下面的代碼片段獲取更多信息使用此我們可以減少往返點擊功能以及

$('.wrap').on('click', 'a', function(){ 
 
$(this).addClass("disableClick"); 
 
});

.disableClick{ 
 
    pointer-events: none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="wrap"> 
 
    <a href="#">Click1</a> 
 
    <a href="#">Click2</a> 
 
</div>

Answer 9

I think you can disable anchor link after one click like this 

    <div class="wrap"> 

    <a href="#" id="click1">Click1</a> 

    <a href="#" id="click2">Click2</a> 
</div> 

我認爲你可以在一次點擊取消這些

<div class="wrap"> 
     <a href="#" id="click1">Click1</a> 
     <a href="#" id="click2">Click2</a> 
    </div> 

$(function() { 
$('#click1').on("click", function (e) { 
    $('#click1').on("click", function (e){ 
     e.preventDefault(); 
     e.preventDefault(); 
    }); 
}); 

錨鏈接，我認爲它的幫助你。