form 表单中 disabled 属性的元素不参与表单提交

示例代码:

当上述两种写法出现时,表单提交的数据中,将不包括 age 这个属性,这是因为 input 被设置为了 disabled

若想将 age 属性随 form 表单提交,个人推荐解决办法是不设置 disabled,改为 readonly,具体参照 W3C 的规范。

input 设置 disabled 和 readonly 的区别

disabled 的限制:

  1. 不能接收焦点
  2. 使用 tab 键时将被跳过
  3. 可能不是 successful 的

readonly 的限制:

  1. 可以接收焦点但不能被修改
  2. 可以使用 tab 键进行导航
  3. 可能是 successful 的

只有 successful 的表单元素才是有效数据,也即是可以进行提交。disabledreadonly 的文本输入框只能通过脚本进行修改 value 属性。

disabled 和 readonly 两个 HTML 属性的区别

  1. readonly 是要锁定这个控件,通过在界面上无法修改他(但是通过 javascript 可以修改它)。

  2. disabledreadonly 有相同的地方也是可以锁定这个控件用户不能改变他的值,但是 disabled 的更彻底一些,这是要使控件完全不能使用,彻底失效,包括改变它的背景颜色(不信,你去修改一个被 disabled 掉的 input 文本框,发现这是徒劳的),如果是 checkbox 则不能选中它。

  3. 所有控件都有 disabled 属性,但是不一定有 readonly 属性,如 select 下拉框。

你可能感兴趣的:(form 表单中 disabled 属性的元素不参与表单提交)