Отключить якорные кнопки

Question

Мне нужна помощь, чтобы кнопка Якоря не была нажата после того, как она была нажата один раз раньше.

Любая помощь будет оценена заранее спасибо

HTML КОД:

  <div class="text-center"> 
      <a role="button" class="btn btn-success" id="createGameButton" onclick="addGame();">Create Coinflip</a> 
     </div> 

JAVASCRIPT КОД:

function addGame() 
{ 
var side = $("#side").val(); 
var steamid = $("#steamid").val(); 
var amount = $("#amount").val(); 
var buttonText = document.getElementById('createGameButton').innerHTML; 

if(buttonText=='Create Coinflip') 
{ 
    $.ajax(
    { 
     url: 'addGame.php', 
     type: 'POST', 
     data: 'side=' + side + '&steamid=' + steamid + '&amount=' + amount, 
     dataType: 'text', 
     success: function (data) 
     { 
      document.getElementById('game-alert').innerHTML = data; 
      $("#game-alert").fadeIn(); 
      refreshGames(); 
      document.getElementById('createGameButton').innerHTML = 'Create Coinflip'; 
     } 
    }); 
} 
} 

Answer 1

добавить флаг на вершине своей функции является общая методика для остановки исполнение:

function addGame() { 
    if(addGame.flag) 
    return; 
    addGame.flag = true; 
    // rest of procedure .... 

• addGame.flag добавляет свойство к функции addGame
• первый раз, когда он запускает его устанавливает флаг истинного
• когда флаг верно, то функция будет возвращать сразу

Answer 2

удалить onclick="addGame();" и использовать one

.one()

Прикрепите обработчик к событию для элементов. Обработчик выполняется не более одного раза за элемент за тип события.

так: -

$('#createGameButton').one("click", addGame); 

Answer 3

Вы можете сделать это, добавив класс «отключен» в кнопке, Here is JSBIN

Answer 4

Вы можете добавлять/удалять классы, чтобы адаптировать поведение вашей функции мыши ,

HTML-код (без OnClick)

<a role="button" class="btn btn-success" id="createGameButton" >Create Coinflip</a> 

Javascript кода

$("#createGameButton").click(function(){ 

    //if we have not clicked already on this link 
    if(! $(this).hasClass("already-clicked")) 
    { 
     $.ajax(
     { 
      /* [...your normal code...] */ 
      success: function (data) 
      { 
       /* [...your normal code...] */ 
       $(this).addClass("already-clicked") 
      } 
     }); 
    } 
});