HTML | 只读属性

HTML 中的 <textarea> 标签是用于将多行文本显示在页面上的元素。 它通过其 readOnly 属性来控制其是否可以编辑。

readOnly 属性

readOnly 属性在 <textarea> 元素中用于控制其是否可以编辑。如果将 readOnly 属性设置为 true，则文本区域将变为只读，用户无法编辑其中的文本。

<textarea readOnly>This text area is read only</textarea>

在上面的代码片段中，我们将 <textarea> 元素的 readOnly 属性设置为 true。这表示，任何用户都无法编辑此文本区域中的文本。

使用 JavaScript 动态控制 readOnly 属性

我们还可以通过 JavaScript 动态地控制 <textarea> 元素的 readOnly 属性。下面是一个示例：

<textarea id="myTextarea">This is my textarea</textarea>
<button onclick="makeReadOnly()">Make Read Only</button>
<button onclick="makeReadWrite()">Make Read/Write</button>

function makeReadOnly() {
  document.getElementById("myTextarea").readOnly = true;
}

function makeReadWrite() {
  document.getElementById("myTextarea").readOnly = false;
}

在上面的示例中，我们有两个按钮，一个是将 <textarea> 元素设为只读，另一个是将其设为可读写。这是通过 JavaScript 动态设置 <textarea> 元素的 readOnly 属性实现的。

总结

<textarea> 元素的 readOnly 属性很容易使用。它允许我们轻松地控制文本区域的编辑性能。 您可以静态地设置该属性，也可以使用 JavaScript 动态地控制该属性。