Internet Explorer 8: как сделать так, чтобы ввод текста только для чтения не имел курсора - PullRequest
4 голосов
/ 22 июля 2011

Я пытаюсь смоделировать внешний вид отключенного ввода текста в Firefox: текстовая область и ввод текста.

Единственная проблема совместимости браузера, о которой мне нужно беспокоиться, - это Internet Explorer 8. Мне НЕ нужно беспокоитьсяо чем-либо ранее (Интранет)

Internet Explorer не позволяет изменять цвет текста отключенного тестового ввода.Это позволяет изменять цвет фона, но серый текст на сером фоне был недоступен для чтения.

У меня есть поле ввода и текстовая область, объявленные следующим образом:

<input name="Count" id="Count" onfocus="this.blur()" type="text" readOnly="readonly" value="0"/>
<textarea name="Notes" id="Notes" style="width: 100%;" onfocus="this.blur()" rows="10" cols="20" readOnly="readonly"/>

У меня есть следующие стили, применяемые через CSS:

input[readonly], textarea[readonly] {
  color:black !important;
  background-color: threedface !important;
}

Визуально это работаетотлично как в Firefox, так и в IE.Тем не менее, IE по-прежнему позволяет курсор в текстовую область или текстовое поле.Чего мне не хватает?

ДОПОЛНЕНИЕ

Под курсором я имею в виду курсор клавиатуры, например, когда вы здесь набираете ответ.

Возможно, моя проблема лучше сформулирована, так как пользователь все еще может щелкнуть текстовую область и показать курсор клавиатурыПохоже, что мигающий курсор быстро исчезает.

Ответы [ 3 ]

3 голосов
/ 22 июля 2011

попробуйте добавить свойство курсора к вашему CSS

input[readonly], textarea[readonly] {
  color:black !important;
  cursor: default;
  background-color: threedface !important;
}

http://www.w3schools.com/cssref/playit.asp?filename=playcss_cursor&preval=default

--- 12/01/27

Пересматривая это решение, я обнаружил, что для меня работает следующее, надеюсь, оно будет полезно и для вас:

1 голос
/ 23 февраля 2015

Используйте эту простую функцию jQuery в теге script для всех полей ввода только для чтения. Вы даже можете использовать любой конкретный идентификатор или класс, если вам нужно только для определенного элемента.

$('input[readonly]').focus(function(){
this.select();
});
0 голосов
/ 23 июля 2011

Можете ли вы использовать disabled=disabled вместо readonly=readonly?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...