除语义和样式外,<fieldset>元素还有一个非常稀缺的功能,就是可以批量禁用表单元素,此能力只有<fieldset>元素才有。
例如:
就这么简单,此时<fieldset>元素里面的所有表单控件元素都无法输入,同时可以匹配CSS:disabled伪类,其效果和在每一个表单控件元素上设置disabled属性一样。
不要使用CSS pointer-events:none声明禁用表单了,也不要再使用HTML inert属性去禁用表单了,这些方法只是表面上的禁用。
图3-37所示的就是某个复杂表单使用<fieldset>元素批量禁用后的效果。
图3-37 使用<fieldset>元素批量禁用表单元素
上述效果你可以通过在浏览器中输入地址https://www.htmlapi.cn/3/4-2.html或扫码访问来体验。