Input Text readOnly 属性

Input Text 对象参考手册 Input Text 对象

设置文本域只读:

姓名: <input type="text" id="myText">
<p>点击按钮设置文本域只读。</p>
<p><strong>提示：</strong> 要查看效果，请尝试在点击按钮前后向文本域中输入信息。</p>
<button onclick="myFunction()">点我</button>
<script>
  function myFunction() {
    document.getElementById("myText").readOnly = "true";
  }
</script>

尝试一下 »

定义和用法

readOnly 属性设置或返回文本域是否为只读。

只读字段是不能修改的。不过，用户仍然可以使用 tab 键切换到该字段，还可以选中或拷贝其文本。

提示：为了保护用户的交互域，请使用 disabled 属性替代。

浏览器支持

Internet ExplorerFirefoxOperaGoogle ChromeSafari

所有主流浏览器都支持 readOnly 属性。

语法

返回 readOnly 属性：

textObject.readOnly

设置 readOnly 属性：

textObject.readOnly = true | false

属性值

值 描述
true|false 规定文本域是否只读
  • true - 文本域只读
  • false - 默认。文本域可修改

技术详情

返回值： 布尔值，如果文本域只读返回true，否则返回false

更多实例

查看文本域是否只读：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>蜜蜂教程(mifengjc.com)</title>
  <script>
    function setResult() {
      document.getElementById("email").readOnly = true;
    }
  </script>
</head>
<body>

  <form>
    Email: <input type="text" id="email">
  </form>
  <button type="button" onclick="setResult()">设置只读</button>

</body>
</html>

尝试一下 »

相关页面

HTML 参考手册: HTML <input> readonly 属性

Input Text 对象参考手册 Input Text 对象