JQuery кнопка регистрирует несколько щелчков мгновенно ⇐ Jquery

[Anonymous]

У меня есть кнопка в моей форме, которая предназначена для проверки того, правильно ли введена информация о авторизации. Это происходит, выпустив вызов Ajax к контроллеру в моем приложении Ruby on Rails и проверив результат. Проблема в том, что даже когда я нажимаю кнопку только один раз, она сразу же регистрирует несколько щелчков - иногда до 5! - И стреляет, что Ajax звонит несколько раз, что попадает в API, который я также проверяю несколько раз. Вот что у меня есть в моем файле html.erb: < /p>


$( document ).on('turbolinks:load', function() {
var $form = $("form");
var $buttons = $('#soap-access, #rest-access, #email-access, #audview-access', $form);
var $jobSchedule = $('#client_job_schedule', $form);

$buttons.click(function (e) {
var $button = $(this);
$button.prop('disabled', true);
var $parent = $button.parent();
var $spinner = $('.fa-sign-in', $parent);
var $signIn = $('.fa-spinner', $parent);
var $success = $('.fa-check', $parent);
var $error = $('.fa-times', $parent);

var data = {};
var $endpoint = '';

// add stuff to data

$signIn.toggleClass('d-none');
$spinner.toggleClass('d-none');
$success.addClass('d-none');
$error.addClass('d-none');

$.ajax({
type: "GET",
url: "",
data: data
})
.done(function () {
$success.removeClass('d-none');
})
.fail(function (jqXHR) {
$error.removeClass('d-none');
if (jqXHR.responseJSON && jqXHR.responseJSON.message) {
alert(jqXHR.responseJSON.message);
} else {
alert('Error trying to authenticate');
}
})
.always(function () {
$button.prop('disabled', false);
$spinner.toggleClass('d-none');
$signIn.toggleClass('d-none');
});
});
});


< /code>
Вы можете видеть, что я добавляю «отключенную» опору, и удаляю ее в конце. Кнопка действительно визуально отключена, но дополнительные клики уже зарегистрированы, и все вызовы AJAX все еще происходят, один за другим.>

Подробнее здесь: https://stackoverflow.com/questions/796 ... -instantly