Question

我正在尝试在用户名，电子邮件或密码字段或所有这些字段为空时禁用表单上的提交按钮，用户填写所有内容我启用了提交按钮。但是以下代码并没有禁用提交按钮。

谢谢

HTML代码：

    <form id="new_user_form">
                                        {% csrf_token %}
                                     <div class="modal-content" data-method="post" id="modalform" >
                                           <div class="modal-header">
                                               <button type="button" class="close" data-dismiss="modal">&times;</button>
                                               <h4 class="modal-title">Sign Up</h4>
                                           </div>
                                        <div onload="validateForm();" class="modal-body">
                                            <div class="form-group">
                                                <label for="usr">Username:</label>
                                                <input type="text" name="username" class="form-control input-sm" id="username">
                                                <label for="eml">Email:</label>
                                                <input type="email" name="emil" class="form-control input-sm" id="emailid">
                                                <label for="passwordd">Password:</label>
                                                <input onchange="checkPasswordMatch();" type="password" name="password" class="form-control input-sm" id="password">
                                                <label for="passwordd">Retype Password:</label>
                                                <input type="password" name="retrypassword" class="form-control input-sm" id="retrypassword">
                                                <br/><div style="color:blue;" id="doesPasswordMatch">  </div>
                                                <span class="help-block">Ensure, You Choose Correct Profession...</span>

                                        <label for="inputfile">Upload Profile Picture</label>
                                       <input type="file" id="inputfile">
                                       <p class="help-block">The Profile Picture help people to identify you.</p>
                                            </div role="Form group">
                                          </div role="modal-dialog">
                        <!--Closing Of Sign Up Modal Page -->
                                                <div class="modal-footer">
                                                                <button type="submit" class="btn btn-default" id="submit" onclose="showSuccessMessage();">Submit</button>
                                                                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                                                </div role="modal-footer">
                                    </div role="modal content">

jquery代码：

<script type="text/javascript">
    function checkPasswordMatch() {
        if ($('#password').val() == $('#retrypassword').val())
            $('#doesPasswordMatch').html("<h4>  Match </h4>").css('color', 'rgb(34,139,34)');
        else
            $('#doesPasswordMatch').html("<h4>  Does not match </h4>").css('color', 'rgb(128,0,0)');

    }
    $(document).ready(function () {
        $('#submit').attr('disable', true);
        $('#retrypassword').keyup(checkPasswordMatch);
        if ($('#username').val() == '' || $('#email').val() == '' || $('#password').val() == '')
            $('#submit').attr('disable', false);
    });
</script>

Answer 1

该属性为disabled（最后为d），而不是disable。虽然attr会出于历史原因为您处理此问题，但设置它的正确方法是通过prop：

$("#submit").prop("disabled", true);
// ----------^^^^---------^

Answer 2

应该是disabled而不是disable

这应该有效：

$('#submit').attr('disabled',true);

或

$('#submit').attr("disabled","disabled");

为什么下面的jquery代码没有禁用提交按钮？

2 个答案: