Question

我发现这个脚本在网络表单中使用。当用户单击复选框时，将显示其他必需的表单字段。如果未单击该复选框，则不需要隐藏的表单字段。

除了我遇到的问题外，它有效：

点击该复选框。
必填表格字段显示
用户提交表单而不填写必填字段
在验证失败后页面重新加载后隐藏所需的表单字段，但仍选中该复选框。

当＃4发生时，我会更喜欢在页面重新加载后显示的字段，因为复选框仍然被选中而不是被隐藏。

<script>
    $(document).ready(function(){

        //Hide div w/id extra
       $("#extra").css("display","none");

        // Add onclick handler to checkbox w/id checkme
       $("#delivery").click(function(){

        // If checked
        if ($("#delivery").is(":checked"))
        {
            //show the hidden div
            $("#extra").show("fast");
        }
        else
        {      
            //otherwise, hide it 
            $("#extra").hide("fast");
        }
      });

        });
</script>

Answer 1

如果您已经在使用jQuery，那么通过让jQuery在提交之前验证表单来保存页面的重新加载是不是不可能的？似乎是一个更好的解决方案，可以确保在提交之前对所有内容进行验证，而不是提交，验证并将表单恢复给用户。

Answer 2

这有效：

$(document).ready(function(){
// Hide div w/id extra
$("#extra").hide();

// Toggle content on initial load
extraToggle($("#used_fixed_price_1"), $("#extra"));

// Add onclick handler to checkbox w/id cb
$("#used_fixed_price_1").click(function(){
extraToggle($("#used_fixed_price_1"), $("#extra"));
});
});

function extraToggle(checkbox, extra)
{
// If checked
if(checkbox.is(":checked"))
{
//show the hidden div
extra.show("fast");
}
else
{
//otherwise, hide it
extra.hide("fast");
}
}

JQUERY SHOW / HIDE表示所需的表单字段。如果未选中则隐藏。显示是否检查但验证失败

2 个答案: