javascript - 如何选择多个输入字段并删除所需的属性？

Question

我在选择多个输入字段并删除所需属性时遇到问题。我使用 Php/Symfony3 并在一页中创建了多个表单。这两种形式都有效，并且它们将正确的信息发送回客户。

表单称为 shippingAddress 和 billingAddress，但是当用户说这两个表单相同时，填写两个表单是没有用的。所以我决定创建一段代码将所有数据设置为空(来自 billingAddress)并将其发送回客户端。工作完美!

现在是问题所在，因为我想要一些必填字段，本地址不相同时他们需要填写这些字段。它不会发送表单，因为它表示某些输入字段尚未归档。

我创建了一些示例，但它看起来不太好。有没有更好的方法来实现相同的结果？并非所有字段都是必需的

编辑:忘记了我问题的重点，需要切换所需的选项。

1

    $(document).ready(function(){
            $("#form_check").click(function(){
                $("#form_billingAddress").fadeToggle();
                $("#form_billingAddress_firstName").removeAttr('required');
                $("#form_billingAddress_lastName").removeAttr('required');
                $("#form_billingAddress_email").removeAttr('required');
                $("#form_billingAddress_streetName").removeAttr('required');
                $("#form_billingAddress_streetNumber").removeAttr('required');
                $("#form_billingAddress_city").removeAttr('required');
                $("#form_billingAddress_pOBox").removeAttr('required');
                $("#form_billingAddress_phone").removeAttr('required');
            });
        });
#2
        jQuery(document).ready(function($){
            $("#form_check").on("click",function(){
                $("#form_billingAddress").fadeToggle();
                $("#form_billingAddress_firstName, " +
                    "#form_billingAddress_lastName, " +
                    "#form_billingAddress_email, " +
                    "#form_billingAddress_streetName, " +
                    "#form_billingAddress_streetNumber, " +
                    "#form_billingAddress_city, " +
                    "#form_billingAddress_pOBox, " +
                    "#form_billingAddress_phone").removeAttr('required');
            });
        });

提前致谢!

Answer 1

您可以在 jQuery 中使用 CSS3 选择器。W3schools 上的选择器文档.

jQuery(document).ready(function($){
    $("#form_check").on("click",function(){
        $("#form_billingAddress").fadeToggle();
        $("input[id^='form_billingAddress_']").removeAttr('required'); // the tick
    });
});

带开关:

var required = true;
jQuery(document).ready(function($){
    $("#form_check").on("click",function(){
        $("#form_billingAddress").fadeToggle();
        if(required){
            $("input[id^='form_billingAddress_']").removeAttr('required');
        }else{
            $("input[id^='form_billingAddress_']").attr('required', true);
        }
        required = !required;
    });
});

使用变量比检查是否需要元素更快。这就是我选择它的原因。

编辑:这样做会更好:

var required = true;
jQuery(document).ready(function($){
    $("#form_check").on("click",function(){
        $("#form_billingAddress").fadeToggle();
        $("input[id^='form_billingAddress_']").attr('required',required);
        required = !required;
    });
});