Как определить, нет ли в списке выбора ничего выбранного в IE 8?

#javascript #internet-explorer #dom

#javascript #internet-explorer #dom

Вопрос:

Как я могу использовать JavaScript в IE 8, чтобы различать список выбора с выбранным первым элементом и список, в котором ничего не выбрано?

 <select id="first">
    <option>John</option>
    <option>Paul</option>
</select>

<select id="second">
    <option selected="selected">George</option>
    <option>Pete</option>
</select>
 

Браузеры отображают первый список с явно выбранным «John». В Chrome и Firefox этот параметр выбран неправильно: селектор CSS не найдет его, поэтому я могу сказать, что он не выбран. Однако IE 8 выбирает его правильно, поэтому я не могу сказать, что он не был выбран.

Вот скрипка, которая проверяет, что я могу определить разницу между двумя случаями в FF и Chrome, но не в IE: http://jsfiddle.net/YvfpV/7 /

Есть ли какой-нибудь способ отличить два случая в IE 8?

Комментарии:

1.На самом деле, в FF и Chrome select.selectedIndex значение равно 0, поэтому элемент фактически выбран, но option.selected не установлен. (Скрипка показывает это.) Это несоответствие заключается в том, как я могу сказать, что элемент не был предварительно выбран. IE работает последовательно, чего я на самом деле не хочу в этом случае. Плохой IE: даже если это правильно, это неправильно.

2. Логика, основанная на причуде браузера, которая может быть несовместимой даже для разных версий одного и того же браузера, не является хорошим способом построения надежной системы.

3. Кстати, в Firefox 5.0 select.selectedIndex == 0 и firstOption.selected == true по умолчанию, так что ваша логика терпит неудачу в этой версии Firefox.

4. @RobG: хорошие замечания, хорошо сделано. Итак, я так понимаю, что ваш ответ на мой первоначальный вопрос — «нет». Вернемся к чертежной доске.

5. Я был неправ раньше, когда говорил, что FF и Chrome не устанавливают option.selected параметр по умолчанию: они это делают. Но разница в том, что, хотя option.selected значение true , селектор CSS option[selected] не соответствует ему. Так что это выглядит как ошибка в FF и Chrome, простая и понятная.

Ответ №1:

Если параметр не выбран, свойство SelectedIndex выбранного элемента будет равно -1.

Однако, если ни один параметр не имеет атрибута selected (т.Е. Ни один из них не выбран заранее), браузеры могут выбрать один параметр по умолчанию. Поэтому рекомендуется, чтобы один параметр имел атрибут selected, чтобы вы знали, какой из них будет выбран по умолчанию, и никогда не должно быть случая, когда никакие параметры не выбраны.

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

Редактировать

 <form onsubmit="return false">
  <select id="sel0">
    <option>0
    <option>1
  </select>
  <button onclick="
    var sel = document.getElementById('sel0');
    alert('selectedIndex: '   sel.selectedIndex    // 0
          'noptions[0].selected: '   sel.options[0].selected); // true
    ">hey</button>
  <input type="reset">
</form>
 

В Firefox 5 и Chrome 14 состояние выбора по умолчанию имеет значение selecteIndex == 0, а выбранное свойство первого параметра == true . Таким образом, очевидная логика в OP не выполняется для этих версий назначенных браузеров.

Комментарии:

1. Да, обычно это невозможно сделать в соответствии со стандартами. Но это возможно в FF и Chrome, и мне интересно, возможно ли это также в IE 8.