如何避免将display:none隐藏的输入字段发送到服务器？

Question

想象一下,您有一个表单可以切换多个字段的可见性.如果未显示该字段,则不希望其值在请求中.

你是如何处理这种情况的？

Answer 1

将表单元素设置为disabled将停止它进入服务器,例如:

<input disabled="disabled" type="text" name="test"/>

在javascript中它将意味着这样的事情:

var inputs = document.getElementsByTagName('input');
for(var i = 0;i < inputs.length; i++) {
    if(inputs[i].style.display == 'none') {
        inputs[i].disabled = true;
    }
}
document.forms[0].submit();

在jQuery中:

   $('form > input:hidden').attr("disabled",true);
   $('form').submit();

Answer 2

您可以使用javascript来设置disabled属性."提交"按钮点击事件可能是执行此操作的最佳位置.

但是,我建议不要这样做.如果可能,您应该在服务器上过滤您的查询.这将更可靠.

Answer 3

如果要禁用隐藏父元素中的所有元素或某些元素,可以使用

$("div").filter(":hidden").children("input[type='text']").attr("disabled", "disabled");

此示例http://jsfiddle.net/gKsTS/禁用隐藏div中的所有文本框

Answer 4

关于什么:

$('#divID').children(":input").prop("disabled", true); // disable

和

$('#divID').children(":input").prop("disabled", false); // enable

在隐藏的div中切换所有子输入(选择,复选框,输入,textareas等).