JQuery: почему hoverIntent здесь не является функцией? - PullRequest
4 голосов
/ 06 августа 2009

Я изменяю некоторый код из вопроса, заданного несколько месяцев назад, и все время захожу в тупик. Суть в том, что я наведите курсор мыши на Anchors, который должен исчезнуть в соответствующих элементах div, а также применить класс «highlight» к Anchor. Я могу использовать базовый JQuery и получать "ОК" результаты, но события мыши делают работу пользователя менее плавной.

Я загружаю JQuery 1.3 через API Google.

И, похоже, работает. Я могу использовать встроенные функции hover () или mouseover (), а fadeIn () не повреждена ... ошибок JavaScript и т. Д. Итак, сам JQuery явно "загружен". Но я столкнулся с проблемой, которую, похоже, все рекомендовали hoverIntent для решения.

После загрузки JQuery я загружаю hoverIntent JavaScript. Я трижды проверил путь, и даже фиктивно доказал путь. Я просто не вижу разумного пути, это может быть вопрос пути.

Как только внешние (якобы) загружены внешние javascripts, я продолжаю со сценарием моей страницы:

var $old=null;

$(function () {
    $("#rollover a").hoverIntent(doSwitch,doNothing)
    });

function doNothing() {};
function doSwitch() {       
        var $this = $(this);
        var $index = $this.attr("id").replace(/switch/, ""); //extract the index number of the ID by subtracting the text "switch" from its name
        if($old!=null) $old.removeClass("highlight"); //remove the highlight class from the old (previous) switch before adding that class to the next
        $this.addClass("highlight"); //adds the class "highlight" to the current switch div
        $("#panels div").hide(); //hide the divs inside panels
        $("#panel" + $index).fadeIn(300); //show the panel div "panel + number" -- so if switch2 is used, panel2 will be shown
        $old = $this; //declare that the current switch div is now "old". When the function is called again, the old highlight can be removed.
        };

Я получаю ошибку:

Error: $("#rollover a").hoverIntent is not a function

Если я переключаюсь на известную рабочую функцию, такую ​​как hover (просто меняю ".hoverIntent" на ".hover"), она снова "работает". Я уверен, что это основной вопрос, но я полностью взломан, когда дело доходит до этого (как вы можете видеть из моего кода).

Теперь, судя по всему, кажется, что путь неверный (я проверил zillion и даже разместил его на внешнем сайте с HTTP-ссылкой, которую я дважды проверил; это не так), или. JS не объявляет функцию. Если это последнее, мне, должно быть, не хватает нескольких строк кода, чтобы сделать функцию доступной, но я не смог ничего найти на сайте автора. В своем исходном коде он использует $ (document) .ready, который я тоже пытался эмулировать, но, возможно, я тоже ошибся.

Опять же, странно, что .hover работает нормально, .hoverIntent - нет. Я не могу понять, почему это не считается функцией.

Попытка не пропустить ничего ... давайте посмотрим ... нет других вызываемых скриптов JavaScripts. Этот пост содержит весь Javascript, который использует страница ... Я пытался сделать это в соответствии с примером var config автора (hoverIntent по-прежнему не является функцией).

У меня появляется зуд, мне просто не хватает одной строки для объявления функции, но я не могу понять, что это такое или почему она еще не объявлена ​​во внешнем файле .js. Спасибо за понимание! Грег


Обновление:

Самое странное, так как я нахожусь на этом ... и на самом деле, если это будет решено, мне может не понадобиться hoverIntentрешено:

Я добавляю оповещение в функцию "doNothing" и возвращаюсь к старому .hover, просто чтобы посмотреть, что происходит. Для двух из моих 5 якорей, как только я наведусь, вызывается doNothing (), и я вижу предупреждение. Для остальных 3 doNothing () правильно НЕ вызывается до отключения мыши. Как вы можете видеть, та же функция должна применяться к любому Anchor внутри div "rollover". Я не знаю, почему это так.

Но:

  1. Если я изменю fadeIn на другой эффект, например slideDown, doNothing () корректно НЕ будет вызываться до отключения мыши.
  2. при использовании fadeIn, doNothing () не вызывается в Opera, но, похоже, вызывается практически во всех других браузерах.

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

Приветствия за ваше долгое внимание ...

Грег

1 Ответ

1 голос
/ 06 августа 2009

Надеюсь, я не тратил слишком много времени многих людей ...

Как оказалось, вторая проблема тоже была в 2 футах от экрана. Я подозревал, что это будет связано с HTML / CSS, потому что странно, что только 2 из 5 элементов демонстрируют странное поведение.

Итак, проверил мой код, откопал нашего друга FireBug и обнаружил, что я завис над другим div, который перекрывал мой rollover div. Причина бытия? В CSS я назвал его .panels вместо .panel, а имя класса - .panel. Таким образом, он использовал значения по умолчанию для div ... т.е. 100% ширина ...

Ответ на вопрос ... «Будь осторожнее»

Мэтт и Мак заставили меня еще раз проверить мой код и, конечно же, я перезагрузил JQuery после загрузки другого плагина и вставки своего собственного кода. Так как hoverIntent модифицирует hover () JQuery для работы, повторная загрузка JQuery испортила его.

Это решило, логика продиктовала, что я пересматриваю свой HTML / CSS, чтобы исследовать мою странность fadeIn () ... и, конечно же, у меня была опечатка в классе, что вызвало некоторый хаос.

Тупой, тупой, тупой ... Но теперь я могу спать.

...