javascript - 输入上的 Bootstrap 启用按钮

Question

我在正确完成此操作时遇到一些问题。我希望我的“发送”按钮在框中有任何字符时立即启用(删除禁用)。我现在已经尝试了多种方法，但无法让它发挥作用。

HTML 部分:

<input type="password" id="inputPassword" class="form-control" placeholder="Password" required>

    <input id="sendit" class="btn btn-lg btn-primary btn-block disabled" type="submit" value="Generate Codes"></input>

JS文件

    $(document).ready(function() {
    var pass_error = 1;

    // Check name field

        if (inputPassword === '') {
            pass_error = 1;
        } else {
            pass_error = 0;
        }
        enableButton();
    });


    // verzendknop pas activeren nadat alles is ingevuld en gecontroleerd
    function enableButton() {
        if (pass_error!== 0) {
            $('#btn btn-lg btn-primary btn-block').attr('disabled', 'disabled');
        } else {
            $('#btn btn-lg btn-primary btn-block').removeAttr('disabled');
        }
    };
});

Answer 1

您的代码仅在 DOM Ready 后检查该字段一次。

您需要将支票与该字段上的 keyUp 事件联系起来:

$('my-field').keyUp(function() {
 if($(this).val() === '') {
  pass_error = 1;
} else {
  pass_error = 0;
  enableButton();
});