0

Этот скрипт срабатывает один раз. При клике кнопка блокируется. CSS свойства применяются. Через 5 сек кнопка автоматически разблокируется. Но при последующих нажатиях скрипт не блокирует кнопку и css свойства не применяются

    function timerBlock() {
            $(this).prop('disabled', 'false').css('cursor', 'pointer');
            console.log('Кнопка разблокирована');
        }

    $("#one-form-line").click(function() {
        $(this).prop('disabled', 'true').css('cursor', 'not-allowed');
        console.log('Кнопка заблокирована');            
        setTimeout(timerBlock, 5000);
    });

2

1 ответ 1

1

На самом деле в интернете полно уже готовых решений, как на jQuery, так и нa чистом JavaScript:

$("#btn").on("click", function(){
    var $self = $(this);
    $self.attr("disabled","disabled");
    setTimeout(function(){
        $self.removeAttr("disabled");
    }, 5000);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="btn">Click me</button>

То же самое на чистом JavaScript:

document.getElementById("btn").addEventListener("click", function(){
    document.getElementById("btn").disabled = true;
    setTimeout(function() {
        document.getElementById("btn").disabled = false;
    }, 5000);
});
<button id="btn">Click me</button>

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.