JQuery не запускается в IE8

Question

JQuery не запускается в IE8

0

У меня проблема с сайтом, который я создаю.

Одной из особенностей сайта является опрос, в котором запрашивается информация. Один тип вопросов - это "Визуальный выбор", который показывает изображения, которые можно щелкнуть. Эти изображения соответствуют (скрытым) флажкам, которые записывают свои ответы. Контролируемому элементу присваивается граница, что приводит к приятному визуальному опыту для наших пользователей.

Тем не менее, пользователи IE8 не могут щелкнуть изображения - теги <img> внутри ярлыков не могут быть изменены в IE8, а селектор :checked CSS недоступен. Наши заинтересованные стороны хорошо разбираются в IE8, имеющем ухудшенный опыт, но он должен работать на них.

Для того, чтобы опыт IE8 деградировал изящно, я завернул опрос в div только для IE8 (используя условные комментарии, чтобы получить только IE8 и ниже) и написал строку или два из CSS, чтобы флажки были видны.

К сожалению, флажки находятся за пределами плавающего элемента и, таким образом, очень далеки от того, где находится этот элемент.

Я написал несколько jQuery, которые отделяют флажки и снова присоединяют их к плавающим элементам. Я завернул этот jQuery в том же виде условных комментариев, протестировал его в IE8 в режиме IE8 с поддержкой IE4 и переместил код на сервер.

Он не работает на реальном IE8. Код, включая jQuery, который обернут условными комментариями, работает на IE11, эмулированном IE8, но не на реальном IE8.

Что я могу сделать, чтобы решить эту проблему?

Здесь jsFiddle, который показывает упрощенную версию вопроса опроса. Код на панели javascript завернут в теги <!--[if lte IE 8]> на последней странице.

Jeff 25 апр. 2014, в 21:33

Источник

Теги:

jquery

internet-explorer-8

conditional-comments

1 ответ

Ещё вопросы

Axel · Answer 1 · 2014-04-25T17-39-00.000Z

Вы слишком усложняете решение, используя все эти условные хаки.

Все, что вам нужно сделать, это решить проблему, с которой вы столкнулись в IE8, она не поддерживает щелчок ярлыков.

Вы можете сделать это, просто привязывая событие щелчка меток непосредственно к самим входам.

Это должно работать для ваших нужд (включите его где-нибудь после загрузки jQuery).

<!--[if lte IE 8]>
<script type="text/javascript">
$(function () {
    $("label").click(function(){
        if ($(this).attr("for") != "")
            $("#" + $(this).attr("for")).click();
    });
});
</script>
<![endif]-->

ВАЖНО: Убедитесь, что for="" на ваших ярлыках соответствует id="" на ваших входах.

Это не полностью решает проблему. Причина, по которой мне пришлось прибегнуть к этим хакерам, заключается в том, что IE8 также не поддерживает методы CSS, которые я использую, чтобы обвести границы вокруг выбранных ответов. Не имея флажка и границы, пользователь не может узнать, что его клик что-то сделал.
Затем напишите простой сценарий jQuery, который применяет класс к элементу на основе выбранного флажка, а затем задайте стиль для этого класса, чтобы показать границу. Использование условных хаков следует использовать в качестве крайней меры.