ajax request timeout?

Question

JavaScript

There is a function that performs an ajax request on a button click.

function LoadQuest()
{
  $.ajax({
    type: "POST",
    url: "/ajax/",
    data: {
      's_id': s_id,
      'member_id': member_id,
      'param': 'LoadQuest'
    },
    error: function()
    {
      document.getElementById('load_button').innerHTML = '<button type="button" tkey="loadmore_button">'+load_more+'</button>';
      console.log(3);
    },
    beforeSend: function()
    {
      document.getElementById('load_button').innerHTML = '<button type="button" onClick="LoadQuest()">\
                                  <div class="sk-spinner sk-spinner-wave">\
                                    <div class="sk-rect1"></div>\
                                    <div class="sk-rect2"></div>\
                                    <div class="sk-rect3"></div>\
                                    <div class="sk-rect4"></div>\
                                    <div class="sk-rect5"></div>\
                                  </div>\
                                </button>';
    },
    success: function(msg)
    {
      console.log(0);
      msg = jQuery.parseJSON(msg);
      if(msg['error'] == true)
      {
        document.getElementById('load_button').innerHTML = '<button type="button" tkey="error_14">'+msg['text']+'</button>';
        console.log(1);
      }
      else
      {
        for(var i = 0; i < count(msg); i++)
        {
          console.log(2);
          message += '<div class="footer">\
                  <div class="title">'+msg[i]['q_title']+'</div>\
                  <div class="quest-content">'+msg[i]['q_text']+'</div>\
                </div>\
                <div class="clearfix"></div>';
          sid = msg[i]['q_id'];
        }
        s_id = sid;
        document.getElementById("quest").innerHTML = message;
        document.getElementById('load_button').innerHTML = '<button type="button" onClick="LoadQuest()" tkey="loadmore_button">'+load_more+'</button>';
      }
    }
  });
}

How to prevent button click flooding? because requests are sent to the database. I tried timeout, it doesn't work, or I'm doing something wrong, or the code doesn't want to work.

Answer 1

remove the click handler from the button for the duration of the request.

Answer 2

It can be in a bunch of ways.
Remove handler from click event

var $button = $("button#send-ajax");
function clickHandler () {
    // Отправка Ajax
    // ...

    // Отключаем обработку события клика
    $button.off('click'); 

    // Включаем через 3 секунды
    setTimeOut(function () { $button.on('click', clickHandler); }, 3000);
}

// Включаем обработчик события
$button.on('click', clickHandler)

When clicking, we check the time variable of the last click, if more than 3-5 seconds have passed. execute the query and update the time in the variable.

By analogy with the first example, only hide the button for a while instead of deleting the handler