我注意到在表单中使用的 Web 应用程序中有两种模式,我不记得它们是如何到达那里的。
一个使用<input ... type="hidden" />
传递令牌,其他部分使用<input ... hidden />
。
我查看了attribute和type=的 MDN 页面,它们看起来完全相同。
我去了this question,它似乎表明hidden
属性将隐藏显示,但不是从其他用户输出方法(如屏幕阅读器)。
This question讨论了显示和type="hidden"
,但没有提到其他类型的用户输出方法。
这两个如何被不同的输出设备以不同的方式处理?它们如何被表单以不同的方式处理?它们是否被 DOM 或 DOM-stuff 区别对待?
这两者之间是否有一些功能差异?是否有一些“最佳实践”差异?一些“预期的方式来做到这一点”的区别?
当你有像<input hidden>
这样的标记时,它实际上是<input hidden="hidden">
的快捷方式,与<input type="hidden">
明显不同。
documentation of hidden
attribute将其描述为与属性style="display:none"
基本相同,但没有明确说明允许支持属性hidden
但不支持 CSS 的理论用户(UA)。至少在理论上,当Content-Security-Policy
阻止style
属性工作时,属性hidden
也可以工作,但据我所知,此详细信息尚未定义。
属性hidden="hidden"
隐藏的元素仍然可以提交,因为上面的文档明确说
隐藏元素不应该与非隐藏元素链接,并且作为隐藏元素后代的元素仍然处于活动状态,这意味着脚本元素仍然可以执行,表单元素仍然可以提交。
现实世界的用户(例如 Firefox 和 Chrome)可能不会以有效的 CSS 样式display:none
发送输入,但这实际上不是文档描述的行为。
documentation of input type
attribute value hidden
明确表示将为该表单元素提交具有此属性的输入,但用户无法修改或查看。(但是,这不能用于避免进行服务器端安全检查,因为用户仍然可以使用例如开发人员工具来检查或修改该值。)
TL;DR:如果要提交隐藏的表单元素,则应使用type="hidden"
;如果只想向访问者隐藏元素,则应使用hidden="hidden"
或 CSS 样式。区别在于语义比实际更多,但是type="hidden"
由真正的旧用户更好地支持。
同样在某些浏览器中,使用属性“hidden”限制属性“value”中的输入内容,p.e,在 chrome for iOS 的情况下,此限制设置为 500ko。另一个区别是属性“hidden”is not 100% supported就像今天一样。
本站系公益性非盈利分享网址,本文来自用户投稿,不代表码文网立场,如若转载,请注明出处
评论列表(46条)