JQuery / AJAX в IE: объект не поддерживает это свойство или метод

Question

Хорошо, я в тупике. По сути, этот скрипт отлично работает в FF, но не в IE (6,7 или 8), в котором он возвращает ошибку «Объект не поддерживает это свойство или метод». Есть идеи?

function portfolioAjaxLoader(page){
$("div#portfolio_container").load("include/DCK_portfolio_gallery.inc.php?cat=" + page);
}

$(document).ready(function(){

  $('a.portfolio_subnav').livequery('click',function(){
    portfolioAjaxLoader(this.title);
    return false;
    });

//modify page DOM if Javascript is switched on
$('div#gallery_frame').livequery(function(){
    //assign portfolioAjaxLoader to sub navigation links

    gallery_frame = $('div#gallery_frame');
    //set gallery_strip width to the number of entries multiplied by width of gallery entry element
    gallery_strip = $('div#gallery_strip');
    gallery_entries = $('div#gallery_strip a');
    elementWidth = 235;
    gallery_strip_width = elementWidth*gallery_entries.length+'px';
    gallery_strip.css({'width':gallery_strip_width});

    //add portfolio navigation buttons
    if(gallery_entries.length>4){
        $('div#portfolio_nav').before('<p id="portfolio_nav_prev"></p><p id="portfolio_nav_next"></p>');
        }

    //assign event triggers to inserted portfolio nav elements
    prev = $("p#portfolio_nav_prev");
    next = $("p#portfolio_nav_next");

    scrollPrevMax = (((gallery_entries.length - 4) * elementWidth)+20);//tolerance
    scrollMax = ((gallery_entries.length - 5) * elementWidth);
    scrollMin = ((gallery_entries.length - 6) * elementWidth);
    });


    function nextAnim(){
        //remove handler
        next.unbind();

        var currentScrollPos = gallery_frame.scrollLeft();
        var targetPos = currentScrollPos + elementWidth;

        if(currentScrollPos > scrollMin){
           next.fadeOut("fast");
           }

        if(currentScrollPos >= 0){
           prev.fadeIn("fast");
           }


        gallery_frame.animate({scrollLeft:targetPos}, 300, 'easeInOutQuart',function(){next.bind('click',nextAnim)});
        return false;
        }


    function prevAnim(){
        //remove handler
        prev.unbind();

        var currentScrollPos = gallery_frame.scrollLeft();
        var targetPos = currentScrollPos - elementWidth;

        if(currentScrollPos < scrollPrevMax){
            next.fadeIn("fast");
            }

        if((currentScrollPos == 0)||(currentScrollPos < elementWidth*2)){
            prev.fadeOut("fast");
            }

        gallery_frame.animate({scrollLeft:targetPos}, 300, 'easeInOutQuart',function(){prev.bind('click',prevAnim)});
        //prev.bind('click',prevAnim);
        return false;
        }

    next.click(nextAnim);
    prev.click(prevAnim);

});

Я специально оставил некоторые элементы в глобальной области видимости (опуская var в их объявлении).

Только для записи, здесь сообщается об ошибке:

gallery_frame = $('div#gallery_frame');

Символ 9, строка 16.

Answer 1

ОК, похоже, я его взломал. Во-первых, мне нужно было инициализировать переменные в открывающей функции document.ready, т.е.

var gallery_frame,gallery_strip,gallery_entries,elementWidth,gallery_strip_width, prev, next, scrollPrevMax,scrollMax,scrollMin;

Затем мне пришлось переместить назначения обработчика событий в функцию livequery, которая обнаруживает фрейм галереи.

Спасибо за помощь, ребята.

Answer 2

Если вы уверены, что вы включили правильный файл скрипта jQuery и все еще получаете эту ошибку, пожалуйста, проверьте, что другие js-файлы не конфликтуют или не переопределяют метод

Answer 3

Когда вы включаете скрипт в ваш HTML, какой тип arttribute вы устанавливаете? Я столкнулся с ситуациями, когда я установил type="application/javascript", где он должен быть установлен как type="text/javascript". Если вы являетесь пользователем Dreamweaver, приложение / javascript указывается первым, и это «правильный» выбор ... за исключением того, что браузеры IE (как минимум 6/7, возможно 8) не понимают этот параметр. Вы должны использовать текст / JavaScript.

Когда я слышу о счастливых FF-сценариях и отсутствующих IE-сценариях, это то, о чем я думаю в первую очередь. Я был травмирован таким образом один раз. :)

Answer 4

Поскольку он не работает в IE8, я бы посоветовал вам использовать Web Developer Toolkit, для меня я нажимаю F12, а затем вы можете начать отладку, которая перезагрузит вашу страницу, и вы должны увидеть строку, в которой произошла ошибка.

Answer 5

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

debugger;

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