使用input的disable和readonly两个属性。
先来看下二者的区别：
<input
type=
"text
"
readonly=
"true
"
value=
"这是readonly的！
">
<input
type=
"text
"
disabled=
"true
"
value=
"这是disabled的！
">
可以看到，虽然两种都是让input的内容不能被用户编辑，但是对于后期的美工处理就有问题了！
例如：
<style>
input
{
color:blue
}
</style>
只有readonly的那个文本是蓝色的！
disabled是按系统设置的disabled颜色来设置前景色的，css对其无效！
另外，readonly和disabled还有一个不同点就是，当input属性为readonly时，提交表单是可以获得input的内容。
如果是disabled则不能获得所提交的内容，返回值全部为null，所以此处需要注意。
慎用readonly和disabled，指定了disabled的表单，在submit时，不会把它的值传出去。
例如，有两个text，一个是readonly一个是disabled，submit后，只能发送那个不是disabled的。
注意地址栏的值.
要保存到本地，因为submit了，不然，看不到效果。
readonly属性是一个布尔属性，可用于指定在input或textarea元素中写入的文本是只读的。这意味着用户不能修改或更改特定元素中已经存在的内容（但是，用户可以对其进行制表、突出显示和复制文本）。而JavaScript可以用来更改只读值并使输入字段可编辑。
原文地址： HTML的readonly属性怎么用？
readonly 属性指定输入字段为只读，只读字段是不能修改的。不过，用户仍然可以使用 tab 键切换到该字段，还可以选中或拷贝其文本。
readonly属性可与下面列出的两个元素一起使用：
1、<input>和readonly属性
语法：
例：
效果图：
2、<textarea>和readonly属性
语法：
例：
效果图：
readonly属性支持的浏览器如下：
● Apple Safari 1+
● Google Chrome 1+
● Firefox 1+
● Opera 1+
● Internet Explorer 6+
推荐阅读：
java基础教程
layui框架
go语言教程
作用范围不同
disabled属性可以用语所有的表单元素；readonly属性只对input（输入框）、textarea有效；
对元素的影响程度不同
disabled属性阻止对元素的一切操作，例如获取焦点，点击事件等等；readonly属性只是将元素设置为只读，其他操作正常；
表单提交
disabled属性可以让表单元素的值无法被提交；readonly属性则不影响提交问题；
