在<input>中使用readonly属性而不更改光标

Question

如果我有一个带有readonly属性的<input>字段，它仍会出现在工readonly文本光标中。 有没有办法阻止光标显示？

我无法使用disabled属性，因为request.getParameter()不适用于禁用的字段。

Answer 1

readonly元素的想法是你仍然可以阅读和复制文本，而不是编辑它们。 也就是说，您可以使用CSS属性选择器更改光标。 此示例将使用readonly属性匹配任何input元素：

input[readonly] {
     cursor: pointer;
}

Answer 2

我不想覆盖bootstrap的默认样式，所以我提出了以下解决方案：

我的文件：

input[readonly] {
    &.default-cursor {
        cursor: default;
    }
}

或者在CSS中：

input[readonly].default-cursor {
    cursor: default;
}

我的HTML：

<input type="text" class="form-control text-xl default-cursor" readonly>

Answer 3

在表单中尝试使用此标记作为文本字段

<input type="text" value="test" onfocus="this.blur()" readonly="readonly" />

帮助你隐藏光标的主要内容是onfocus =“this.blur（）”。

Answer 4

对于那些不想让插入符号显示的人：

input[readonly] {
  pointer-events: none;
}