Почему родительские / ближайшие (селекторные) функции jQuery ведут себя по-разному в IE8?

Question

У меня есть сценарий jQuery, который прекрасно работает в Chrome 11 и Firefox 4, но в IE8 он работает некорректно. Похоже, это связано с использованием функции jQuery parent () с селектором. Он не возвращает никаких элементов при запуске в IE8.

Я создал упрощенную версию своей проблемы, которая демонстрирует те же симптомы в jsFiddle, чтобы предотвратить большой кусок кода здесь.

Кто-нибудь может сказать мне, что здесь происходит?

ОБНОВЛЕНИЕ: Использование closest (), кажется, приводит к аналогичному поведению, но кажется более подходящим в этом случае.

Answer 1

Элементы верхнего уровня должны быть разделами? Похоже, вы сталкиваетесь с одной из областей, где отсутствие поддержки HTML5 в IE8 ограничивает вас. Если вы измените разделы на div, код работает как есть.

Поддержка разделов в браузерах.

Answer 2

Глядя на селекторы в вашем jsFiddle, я смог заставить его нормально работать в IE8, если бы только избавился от второй части селектора.

$(document).ready( function(){
     $('a[data-detailed]').live('click', function(event){
        var a = $(this);
        var key= a.attr('data-detailed');

        $(".detailedOverview[data-detailed="+key+"]").slideToggle('fast');
        $(".masterOverview").slideToggle('fast');
        event.preventDefault();   
    });

    $('a[href=#back]').live('click', function(event){
        var a = $(this);
        var detailedOverview= a.parents("[data-detailed]");

        $(".masterOverview").slideToggle('fast');         
        detailedOverview.slideToggle('fast');

        event.preventDefault();   
    });
});

В каждом из ваших селекторов у вас был ", fileparent" после селектора. Нет необходимости указывать родителя таким образом, и избавление от него работает. На самом деле вы можете избавиться от файла родителей все вместе.