input文本框如何做到不可编辑

1.使用disabled

disabled属性规定应该禁用 input 元素，被禁用的 input 元素，不可编辑，不可复制，不可选择，不能接收焦点,后台也不会接收到传值。disabled 属性无法与 <input type="hidden"> 一起使用。

示例：<input type="text" disabled="disabled" />

            <input type="text" name="input1" value="文本框" disabled>

2.readonly

readonly属性规定输入字段为只读可复制，但是，用户可以使用Tab键切换到该字段，可选择,可以接收焦点，还可以选中或拷贝其文本。后台会接收到传值. readonly 属性可以防止用户对值进行修改。

readonly 属性可与 <input type="text"> 或 <input type="password"> 配合使用。

    示例：<input type="text" readonly="readonly">

            <input type="text" name="input1" value="文本框" readonly>

两种方法的区别在于：

1、   readonly设置的不可编辑状态的文本框内的值可以通过from表单提交；

disabled设置的不可编辑状态的文本框内的值不可以通过from表单提交；

2、   readonly设置的对象仅限于<input>和<textarea>；

disabled设置的对象是所有标签；

3. onfocus=this.blur()

onfocus=this.blur()会使文本框无法聚焦，做到无法选择。

<input type="text" name="input1" value="不可编辑文本框" onfocus=this.blur()>

注意：onfocus=this.blur()会导致tab键无法调到使用了onfocus=this.blur()后面的文本框。如果有很多的输入文本框不建议使用影响体验