<input>のreadonly属性をカーソルを変更せずに使用する

Question

readonly属性を持つ<input>フィールドがある場合、Iビームテキストカーソルとともに表示されます。カーソルの表示を停止する方法はありますか？

無効なフィールドでrequest.getParameter()が機能しないため、disabled属性を使用できません。

Answer 1

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

テキストフィールドのフォームでこのマークアップを試してみてください主なものは、ONFOCUS = "これです.blur（） "

Answer 2

readonly要素のアイデアは、テキストを読み取ってコピーすることができ、編集することはできないということです。つまり、CSS attribute selectorsを使用してカーソルを変更できます。この例ではreadonly属性を持つ任意のinput要素にマッチします：あなたがカーソルを隠すことができます

input[readonly] { 
    cursor: pointer; 
} 

Answer 3

私は、次の解決策と一緒に来て、私は、ブートストラップのデフォルトのスタイルを上書きしたくありませんでした：

マイLESSファイル：

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 4

キャレットを表示したくない人向け：

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