Блог

Главная - Вопросы по программированию - Как отключить кнопку с помощью JavaScript

Как отключить кнопку с помощью JavaScript

#javascript #html #jquery

#javascript #HTML #jquery

Вопрос:

Я пытаюсь написать назначение бронирования для своего веб-сайта. Но мне нужно кое-что от вас, чтобы помочь.

  • это мой HTML для поля для ввода:
 <div class="form-group second_box">
<form id="submit" style="display:inline-block" method="post">
<label for="submit" class="control-label">
<?= lang('submit') ?> *</label>
<input type="number" name='otp' id="otp" class="required form-control" placeholder="write your code here" required="required" >
<span id="otp_error" class="field_error"></span>
</div>
  • это моя кнопка HTML:
 <button type="button" id="button-next-3" class="btn button-next btn-primary" onsubmit="submit_otp()"
data-step_index="3"<?= lang('next') ?>
<span class="glyphicon glyphicon-forward"></span>
</button>
  • и это мой Jacascript из другого файла:
 function submit_otp(){
    $('#wizard-frame-3 .has-error').removeClass('has-error');
    $('#wizard-frame-3 label.text-danger').removeClass('text-danger');
    var otp=jQuery('#otp').val();
    jQuery.ajax({
    url:'../../../Code_Verification/check_otp.php',
    type:'post',
    data:'otp=' otp,
    success:function(result){
        if(result=='yesFalse'){
        jQuery('#otp_error').html('Please enter your valid code');
        }
        if(result=='yesTrue'){
        jQuery('#otp').html('Your code is correct');
        }
        if(result=='not_exist'){
        jQuery('#otp_error').html('Please enter valid otp');
        }
    }
    });
}

—> Я использую php в check_otp.php для подключения к моей базе данных для сравнения возвращаемого значения. если ввод в second_box равен значению, которое я сохранил в базе данных, это означает, что клиент может перейти к следующему шагу. если они вводят неверное значение со значением в базе данных, это означает, что они не могут продолжить. но я не знаю, как объединить ее логику.

  • и это следующий вызов кнопки в файле javascript:
 $('.button-next').click(function (){
if ($(this).attr('data-step_index') === '3') {
    if (!_validateCustomerForm()) {
    return; // Validation failed, do not continue.
    }
}

—> спасибо всем за помощь.

Ответ №1:

Поскольку вы используете jQuery, вы можете попробовать

  $("#button-next-3").attr("disabled", true);

Ответ №2:

Используйте .attr() для установки атрибута отключения

Использование $(selector).attr("disabled", true)

В вашем случае : $("#button-next-3").attr("disabled", true)

Ответ №3:

 function myButton() {
     document.getElementById("myBtn").disabled = true;
    }  
 <html>
 <body>
  <button id="myBtn">My Button</button>
  <p>Click the button below to disable the button above.</p>
  <button onclick="myButton()">Try it</button>
  </body>
</html>

Комментарии:

1. Пожалуйста, не публикуйте только код в качестве ответа, но также предоставьте объяснение, что делает ваш код и как он решает проблему вопроса. Ответы с объяснением обычно более высокого качества и с большей вероятностью привлекут внимание.