禁止 input 元素输入内容的方法

夏夜,蟋蟀劲鸣,星光灿烂,月光清澈。孩提时的晨在小山上快活的玩味着每一朵花,每一株草,亦或躺在绿油油的草地数星星。一切都是那么的美好,那么的惬意。

禁止 input 元素输入内容可以给其添加 disabled 和 readonly 属性,虽然这两个属性都可以禁止 input 的输入,但也是有一些差别的!

disabled 属性禁止 input 输入

input 元素添加 disabled 属性,可以使用 input 输入框变灰,并且不可把选中以及复制,在form提交时也不会提交其input的 value 值。

代码:

<input type="text" name="" value="">
<input type="text" disabled="disabled" value="">

运行图:

禁止 input 元素输入内容的方法

readonly 属性设置 input 为只读

input 元素添加 readonly 属性,可以禁止 input 的输入变为只可阅读的状态,其它的地方与正常的 input 功能没有区别,可以被选中,复制等。

代码:

<input type="text" name="" value="">
<input type="text" disabled="readonly" value="">

运行图:

禁止 input 元素输入内容的方法

readonly 与 disabled 属性的区别

1、disabled 可以使用 input 变灰,但 readonly 不会

2、disabled 可以使用input的内容不被复制和选中,但 readonly 不会

3、disabled 在form提前或JS获取内容时,是获取不到的,但 readonly 可以

到此这篇关于禁止 input 元素输入内容的方法就介绍到这了。你真的很不错!祝贺你今天的成功!相信你的明天会更好!更多相关禁止 input 元素输入内容的方法内容请查看相关栏目,小编编辑不易,再次感谢大家的支持!