从提交中排除隐藏的表单字段

我正在隐藏/显示基于复选框状态的div。

 

这是我的Javascript函数:

 function toggle_form_element(id) { if ((document.getElementsByName(id)[0].checked)) { document.getElementById('sometimesHidden').style.display = 'block'; } else { document.getElementById('sometimesHidden').style.display = 'none'; } } 

这是“有时隐藏”的div:

 

现在我想使用我的toggle_form_element函数来排除$ _POST [‘array’]中“hidden”div中的所有输入字段。

但是我怎么能这样做呢?

您可以将禁用的属性添加到您不想提交的任何字段。

 function toggle_form_element(id) { if ((document.getElementsByName(id)[0].checked)) { document.getElementById('sometimesHidden').setAttribute("disabled", "disabled"); } else { document.getElementById('sometimesHidden').removeAttribute("disabled"); } } 

对于jQuery解决方案:

 // Disables all input, select & textarea tags within the .sometimesHidden div if(checked) { $("input, select, textarea", $(".sometimesHidden")).attr("disabled", "disabled"); } else { $("input, select, textarea", $(".sometimesHidden")).removeAttr("disabled"); } 

您可以直接在元素上设置.disabled属性:

 function toggle_form_element(name) { var state = document.getElementsByName(name)[0].checked; document.getElementById('sometimesHidden').disabled = state; } 

修改元素的属性而不是属性几乎总是更好,并且布尔属性的语义也更清晰。

请注意,虽然MDN建议在隐藏字段上忽略此属性:

此布尔属性指示表单控件不可用于交互。 特别是,不会在禁用的控件上调度click事件。 此外,表单不会提交禁用控件的值。

如果隐藏了type属性的值,则忽略此属性。

Chrome 27中的测试表明Chrome 确实遵守了已disabled属性,并阻止了hidden字段的表单值的提交。

此外, W3C规范没有这样的区别。 它只是说“ disabled控件无法成功”。