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

disabled 属性禁止 input 输入

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

代码：

<input type="text" name="" value="顺晟科技博客">
<input type="text" disabled="disabled" value="顺晟科技博客">

运行图：

readonly 属性设置 input 为只读

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

代码：

<input type="text" name="" value="顺晟科技博客">
<input type="text" disabled="readonly" value="顺晟科技博客">

运行图：

readonly 与 disabled 属性的区别

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

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

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