ボタンを1回だけクリックする（js）

Question

私はstackoverflowやその他のウェブサイトを見渡しましたが、私が探している回答が見つかりませんでした。

私は一種のボタンを持っています。ユーザーは一度だけクリックすることができます。これはjavascript/jqueryでclickイベントをトリガーします。しかし、一度クリックするだけで済むようにするにはどうしたらいいですか？

$(document).ready(function() { 
    //var $new_total = $('#gtotal').val(); 

    $('#a_is_valid').click(function() { 
     if ($('#code_promo').val() == 'theCode') { 
      $('#gtotal').val($('#gtotal').val() - ($('#gtotal').val() - (($('#gtotal').val() * .75)))); 
     } 
    }) 
}) 

Answer 1

jQueryの.one()機能を使用を使用することです。

$('#a_is_valid').one('click', function(){ 
    if ($('#code_promo').val() == 'theCode') 
    {$('#gtotal').val($('#gtotal').val()-($('#gtotal').val()-(($('#gtotal').val()*.75)))); 
} 

Answer 2

あなたはクリックイベントが一度だけ起こることを保証しますjqueryの.one()これを使用することができます。

Demo

$('#a_is_valid').one('click', function(){ 

     if ($('#code_promo').val() == 'theCode') 
     { 
      var gtot = $('#gtotal').val(); 
      $('#gtotal').val(gtot -(gtot -(gtot *.75))); 
     } 
}); 

もう一つの方法は、on()とoff()

$('#a_is_valid').on('click', handleClick); 

function handleClick() { 
    var gtot = $('#gtotal').val(); 
    $(this).off('click'); 
    if ($('#code_promo').val() == 'theCode') { 
     $('#gtotal').val(gtot - (gtot-(gtot * 0.75))); 
    } 
} 

Answer 3

なぜ.one()の代わり.click()でしょうか？

Answer 4

現代JSを使用してください！

const button = document.getElementById("a_is_valid"); 
button.addEventListener("click", function() { 
    // Add one-time callback 
}, {once : true}); 

また、単にボタンを無効にできます、

button.disabled = true; 

DocumentationCanIUse