在表单中填写所有必填字段后删除禁用项

Remove disabled after filling all required fields in Form

本文关键字：删除 字段 表单      更新时间：2023-09-26

当我使用Jquery填写表单时，如何从提交按钮中删除禁用的所有必填字段。这是我的HTML:

<form action="" method="post" class="my_form">
    <input type="text" class="form-control">
    <select class="form-control" required>
        <option value="" disabled selected>Select</option>
        <option value="Value 01">Value 01</option>
        <option value="Value 02">Value 02</option>
        <option value="Value 03">Value 03</option>
        <option value="Value 04">Value 04</option>
    </select>
    <input type="text" class="form-control">
    <textarea class="form-control" rows="3" required></textarea>
    <button type="button" data-dismiss="modal" disabled>Save</button>
</form>

您可以有一个on input和on blur事件，当在字段中输入内容或焦点丢失时，该事件会检查所有必需的字段。

检查一下这把小提琴。应该让你明白我的意思。

对jquery prop方法和Array.every方法使用以下方法：

$(".my_form :input[required]").on("change paste", function(){
    var requiredEls = $(".my_form :input[required]").toArray(), filled;
    filled = requiredEls.every(function(v){ // ensure that all required fields are filled
        return v.value.trim();
    });
    $(".my_form :button").prop('disabled', (filled)? false : true);
});
相关文章：