Есть ли способ сделать ввод псевдокласса CSS: фокус не действует, когда файл только для чтения,GWT/MGWT

Question

Я занимаюсь разработкой мобильного приложения с использованием GWT,MGWT и HTML,CSS. В моем представлении есть текстовые поля, некоторые из которых доступны только для чтения. Я использовал псевдокласс css в моем файле css следующим образом:

input[type=text]:focus {
    background-color: #FFFACD;
}  

он работает нормально, когда поле доступно для редактирования, что означает, что текстовый фоновый фон изменяется с #FFFACD, когда курсор находится там, если мы щелкаем / нажимаем на не редактируемое поле, вышеописанное также влияет на то, что я не хочу видеть. Я даже попробовал, как показано ниже:

input[type=text]:disabled{
    background-color:  transparent;
}  

Но я ничего не получаю сверху. Как я могу предотвратить css эффект на поле readOnly. Я делаю поданную как только для чтения, делая так. tf.setReadOnly(true);, Жду вашего ценного предложения.

заранее спасибо,

Answer 1

Вы можете изменить свой селектор на это:

input:not([readonly])[type=text]:focus {
    background-color: #FFFACD;
}

jsfiddle

---

:not хорошо поддерживается (за исключением IE < 9).