HTML readonly属性用法及代码示例

它是一个布尔属性，用于指定在输入或文本区域元素中写入的文本是只读的。这意味着用户无法修改或更改特定元素中已经存在的内容(但是，用户可以对其进行制表，突出显示并从中复制文本)。而JavaScript可用于更改只读值并使输入字段可编辑。

元素：此属性与以下列出的两个元素一起使用：

<输入>：它用于readonly属性，仅读取内容。
<text-area>它用于保存readonly属性。

范例：1

用法：
```
<input readonly>
```

Program:

<!DOCTYPE html> 
<html> 
  
<head> 
    <title>readonly attribute</title> 
    <style> 
        body { 
            text-align:center 
        } 
          
        h1, 
        h2 { 
            color:green; 
            font-style:italic; 
        } 
    </style> 
</head> 
  
<body> 
    <h1>GeeksForGeeks</h1> 
    <h2>readonly attribute in Input Element</h2> 
    <form action=""> 
        Email:
        <input type="text" name="email"> 
        <br> Country:
        <input type="text" name="country" 
                         value="Noida" readonly> 
        <br> 
        <input type="submit" value="Submit"> 
    </form> 
</body> 
  
</html>

Output:

示例：2

用法：
```
<textarea readonly>
```

Example:

<!DOCTYPE html> 
<html> 
  
<head> 
    <title>readonly attribute</title> 
    <style> 
        body { 
            text-align:center; 
        } 
          
        h1, 
        h2 { 
            color:green; 
            font-style:italic; 
        } 
    </style> 
</head> 
  
<body> 
    <h1>GeeksForGeeks</h1> 
    <h2>readonly attribute in input Element</h2> 
    <textarea rows="4" cols="40" readonly> 
      GeeksForGeeks is a good website for  
      learning computer science. It is a  
      computer science portal for geeks. 
    </textarea> 
</body> 
  
</html>

Output:

支持的浏览器：只读属性支持的浏览器如下所示：

谷歌浏览器
IE浏览器
Firefox
Opera
Safari

相关用法

注：本文由纯净天空筛选整理自ManasChhabra2大神的英文原创作品 HTML | readonly Attribute。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。