如何禁用文本区域并保持插入符号处于活动状态

Question

我想知道您如何能够实现禁用文本区域同时又想让文本光标的插入符号仍然处于活动状态的场景，有什么想法吗？

Answer 1

根据您要禁用的内容，您可能正在寻找 readonly 属性。这可以防止粘贴或键入，但不能选择和复制。它也不会使元素变灰。

<textarea>This is a normal textarea.</textarea>
<br>
<textarea readonly>This is a readonly textarea.</textarea>
<br>
<textarea disabled>This is a disabled textarea.</textarea>

现在，如果您想要使元素变灰，使其具有 disabled 外观，您可以使用 CSS 设置其颜色。

textarea[readonly] {
  color: rgba(128, 128, 128, 1);
  background: rgba(128, 128, 128, .15);
  border-color: rgba(128, 128, 128, .15);
  border-style:solid;
}

<textarea>This is a normal textarea.</textarea>
<br>
<textarea readonly>This is a readonly textarea.</textarea>
<br>
<textarea disabled>This is a disabled textarea.</textarea>

如何禁用文本区域并保持插入符号处于活动状态

How to disable textarea and keep caret active

html

textarea

caret