2015-11-12 4 views
1

Я не могу заставить этот код работать в Internet Explorer 11. Я знаю, что этот сегмент вызывает проблему. Если я загружу свой файл с активным кодом, IE 11 полностью очистит все разделы моего веб-сайта. Без него он отобразит информацию на моем сайте, но, очевидно, она не работает.IE 11 addClass + removeClass

Я искал различные функции на http://caniuse.com/, в соответствии с ним существует только частичная поддержка removeClass и addClass, что может быть проблемой. Есть ли какой-то плагин или другая команда, чтобы сделать это совместимым с IE 11?

$(window).on('hashchange', function() { 
    var ImageContainer = $('.tabs > div'), 
    hash = window.location.hash !== '' ? window.location.hash: '#about'; 

    console.log(hash); 

    ImageContainer.hide(); 
    ImageContainer.filter(hash).show(); 
    $('<img/>').removeClass('selected'); 
    $('a[href="' + hash + '"]', '.ImageContainer').addClass('selected'); 
}).trigger('hashchange'); 

EDIT - MARKUP

<div class="tabs"> 

<div id="about">  
<h3>Headline</h3> 
<p>Body Text</p> 
</div> 

<div id="first"> 
<h3>Different Headline</h3> 
<p>Different Body Copy</p> 
</div> 

</div> 

<div id="owl-demo" class="owl-carousel owl-theme"> 

<div class="ImageContainer"> 
    <div id="Color"> 
    <h2>Headline</h2> 
</div> 

<div class="photo grow"> 
    <a href="#first" id="1">  
    <img src="" /> 
    </a> 
    </div> 

<div class="ImageFooter" id="Purple"> 
    <p class="ImageContainerP">Below Text</p> 
    </div> 
    </div> 

</div> 
+0

http://caniuse.com не предоставляет информацию о поддержке браузера для jQuery, которую можно найти в [jQuery] (https://jquery.com/browser-support/) –

+0

«Я искал различные jquery на http://caniuse.com/_ «Методы Oo - jQuery не являются частью сайта, так как на сайте перечислены только собственные функции. – Andreas

+0

@GeorgeLee спасибо за руководство. Я посмотрю на это. –

ответ

1

Вопрос заключается в том, как на IE обрабатывает хэш. Он не по умолчанию пустует строку, как и другие браузеры, по умолчанию она имеет значение «#». Кроме того, вместо установки хэша, вы должны установить местоположение для надежности в IE.

hash = window.location.hash !== '' ? window.location.hash: '#about'; 

становится

hash = window.location.hash; 
if (hash !== '' || hash !== '#') { 
    hash = '#about'; 
    window.location = hash; 
} 

Разметка не делает, потому что не было сброса хэш на входе и выдавать сообщение об ошибке, что «#» не является допустимым селектором для фильтра.

+0

Ты спасатель! Спасибо огромное! –

2

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

Для этого HTML:

<div class="ImageContainer"> 
    <a href="#1234"><img class="selected" src="" /></a> 
</div> 

JS:

$('img').removeClass('selected'); 
$('a[href="#1234"]', '.ImageContainer').addClass('selected'); 

ВЫХОД:

<div class="ImageContainer"> 
    <a href="#1234" class="selected"><img src="" class=""></a> 
</div> 

Проверено на IE 11 и FF 42:

jsfiddle: http://jsfiddle.net/ghorg12110/h1xtty4n/

+0

Спасибо за помощь. Это, к сожалению, не решило мою проблему, но помогло сузить поиск. Моя проблема, вероятно, скрывается где-то в CSS или исходном коде. Это работало отлично для меня в моей собственной скрипке: http://jsfiddle.net/cef1ydna/ Еще раз спасибо! –