2012-01-18 2 views
0

Я работаю над HTML-страницей, где мы бы хотели, чтобы поля input и select dropboxes имели границу вокруг него, поскольку она переводится и фокусируется. Я определил класс ввода в моем CSS вот так:IE8 + IE9 HTML и CSS Focus

input.highlight:focus { 
border: #003366; 
border-style: solid; 
border-width: 2px;  
} 

Поле ввода определяется в моем HTML-файл, как так:

<input class="highlight" name="attorneyName" id="attorneyName" type="text" value="John Jackson" size="50" maxlength="30"> 

В центре внимания, кажется, работает хорошо в Chrome, но в IE фокусируется на одной из моих кнопок независимо от того, что я делаю. Кажется, что кнопка украла атрибут фокуса, и страница никогда не фокусируется на каких-либо полях ввода, поэтому поля никогда не отображаются с рамкой вокруг них, пока они проходят через вкладку. Что может быть причиной этой проблемы?

+0

Можете ли вы загрузить jsFiddle или предоставить полный код? – j08691

+0

http://jsfiddle.net/raphnguyen/7Btj3/. Кажется, что он также правильно фокусируется на jsFiddle, но не на моих сборках IE8 или IE9. – raphnguyen

+0

В этом случае у вас есть прямая ссылка, которую мы можем проверить, поскольку это, вероятно, нечто иное, чем CSS/HTML, который вы нам дали. –

ответ

1

Из другого потока, кто-то смог бы указать, что атрибут :focus распознается только в IE9. Это объясняет, почему версия jsFiddle работает правильно. Однако при запуске файла HTML с моего локального диска IE9 работает в режиме совместимости для IE8 и ниже, а атрибут :focus никогда не распознается.

0

Вы пытались установить атрибут индекса вкладки для элементов страницы. Это свойство поддерживается всеми основными браузерами. Поддержка браузеров: IE, сафари, firefox, chrome.

+0

Спасибо за предложение. Это правильно указывает на поле, которое я задал как 'tabindex =" 1 "', но не устраняет проблему фокуса. Установка '" делает правильно настроен, но я теряю другие элементы страницы. Есть ли DOCTYPE, который может исправить мою проблему при сохранении совместимости с другими элементами моей страницы? – raphnguyen

+0

@raphnguyen: Если вы не используете doctype, вам не помогут. – Hello71

0

«Кнопка, кажется, украла атрибут фокуса, и страница никогда не фокусируется на каких-либо полях ввода, поэтому поля никогда не отображаются с рамкой вокруг них, пока они прокладываются».

Если я понимаю ваш вопрос четко, то у вас есть проблема, а табуляция из одного элемента в другой справа ?.

Если это так, индекс табуляции с увеличивающимся индексом (или любым порядком) позволит вам выбирать следующие элементы при табуляции на основе настройки индекса табуляции, а тег DOCTYPE указывает правила для языка разметки, поэтому что браузеры правильно отображают контент. Конечно, изменения в Doctype имеют тенденцию к изменениям на странице. Быстро посмотрите на w3-школы о doctype, надеюсь, что это может обнаружить некоторый свет.

Приветствия, Arun

+0

Нет, у меня нет проблем с переходом от одного элемента к другому. Я установил атрибут фокуса для каждого текстового поля, так что, когда он находится в фокусе, пользователь может видеть это визуально с помощью рамки вокруг него.Что происходит вместо этого, независимо от того, в каком поле находится пользователь, единственное, что наследует атрибут фокуса, - это кнопка «Jail Address». Текстовые поля могут быть введены и отредактированы просто отлично, но никогда не укажут, что они находятся в фокусе с визуальной границей. – raphnguyen

+0

Можете ли вы поделиться своим кодом, чтобы я работал над ним и надеюсь помочь вам – iDroid

Смежные вопросы