Почему Jquery .attr () не работает с моим объектом в IE 7/8? - PullRequest
Новая
       5

Почему Jquery .attr () не работает с моим объектом в IE 7/8?

2 голосов
/ 08 июля 2010

У меня очень странная проблема с IE, когда функция .attr () ничего не выбирает. 

var tabID = $(selectedTab).attr('id');

selectedTab - это переменная, переданная методом onclick элемента div, как показано ниже: 

<div id="WhatisaDog" onclick="handleSelectedTab(this);" class="tab tabPassive"></div>

Проблема, которую я вижу в консоли javascript инструментов разработчика IE, заключается в том, что когда IE попадает в функцию .attr (), он не возвращает значение id. В этот момент значение selectedTab (переменная, содержащая jqueryselector) равно "# whatisaDog.tab". Разве .attr ('id') не должен возвращать "WhatisaDog"? Он работает в Firefox и Chrome, а не в IE.

любая помощь будет высоко ценится, спасибо!

РЕДАКТИРОВАТЬ: здесь гораздо больше кода. Идея заключается в том, что у меня есть несколько вкладок на странице, и я хочу показать определенный контент в зависимости от того, на какой вкладке была нажата кнопка. да, я знаю о замечательной функциональности вкладок jquery-ui, но я не использую ее, потому что она не работает таким образом. 

$(document).ready(function() {
    $('#DidYouKnow p.tabtextPassive a').append("?");
    var URL = document.URL;
    var params = URL.split("#");
    var tabToLoad = "#" + params[1];
    $(".articleContent").hide();
    if (params[1] != undefined) {
        handleSelectedTab($(tabToLoad +'.tab'));
    }
    else {
        handleSelectedTab($('.tab').first());
    }
});

function handleSelectedTab(selectedTab) {

    $('.tabLeft').removeClass('leftActive').addClass('leftPassive');
    $('.tabRight').removeClass('rightActive').addClass('rightPassive');
    $('.tab').removeClass('tabActive').addClass('tabPassive');
    $('.articleTabFormat p').removeClass('tabTextActive').addClass('tabTextPassive');

    $('.articleContent').hide();

    $(selectedTab).prev().removeClass('leftPassive').addClass('leftActive');
    $(selectedTab).removeClass('tabPassive').addClass('tabActive');
    $(selectedTab).next().removeClass('rightPassive').addClass('rightActive');
    $(selectedTab).children('p').removeClass('tabTextPassive').addClass('tabTextActive');

    var tabID = $(selectedTab).attr('id');
    loadSelectedBodyArea(tabID);
}

function loadSelectedBodyArea(areaID) {

    if (areaID == 'Maps') {
    }
    else if (areaID == 'Flags') {
    }
    else if (areaID == '') {
    }
    else {
        $('#'+ areaID +'.articleContent').show();
    }
}

и вот некоторые из HTML: 

<div id="tabArea"> 
    <div class="articleTabsHolder">
        <div class="articleTabFormat">
            <div id="WhatisaHamster" class="tabLeft leftPassive"> </div>
            <div id="WhatisaHamster" onclick="handleSelectedTab(this);" class="tab tabPassive">
                <p class="tabTextPassive" style="padding-top:10px;">
                    <a href="#WhatisaHamster">What is a Hamster?</a>
                </p>
            </div>
            <div id="WhatisaHamster" class="tabRight rightPassive"> </div></div>
        <div class="articleTabFormat">
            <div id="FactFile" class="tabLeft leftPassive"> </div>
            <div id="FactFile" onclick="handleSelectedTab(this);" class="tab tabPassive">
                <p class="tabTextPassive" style="padding-top:10px;">
                    <a href="#FactFile">Fact File</a>
                </p>
            </div>
            <div id="FactFile" class="tabRight rightPassive"> </div>
        </div>
        </div>
        <div id="WhatisaHamster" class="articleContent"> </div>
        <div id="FactFile" class="articleContent"> </div>
    </div>
</div>

1 Ответ

1 голос
/ 08 июля 2010

вместо 

handleSelectedTab(this);

Почему бы не передать идентификатор функции, чтобы он сразу был доступен 

handleSelectedTab($(this).attr('id'));

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

ОБНОВЛЕНИЕ : См. Комментарий ниже относительно уникальных идентификаторов.

...