jQuery обновляет глобальную переменную, которая является функцией после события клика в другой функции

У меня есть скрипт, который изменяет изображения нескольких элементов списка при нажатии на миниатюры под изображениями, подумайте о образце цвета. Сценарий меняет местами src и пользовательский атрибут data-hover-src (основное изображение и изображение при наведении), переменные функции jquery внутри атрибута HTML onclick заполняются PHP.

Замена основных изображений работает нормально, но изображение при наведении (атрибут data-hover-src) основного изображения не обновляется после нажатия миниатюры.

Вот скрипт, иллюстрирующий проблему: http://jsfiddle.net/YN3LV/14/

Замена изображения при наведении на основное изображение:

 window.HoverImage = function () {
     var $this = $(this);
     var HoverUrl = $this.data('hover-src');
     $this.data('hover-src', $this.attr('src'));
     $this.attr('src', HoverUrl);
 };

 $(function () {
     $('img.image_update').hover(HoverImage, HoverImage);
 });

Обновлять основное изображение при нажатии на миниатюру

 function UpdateImage(color, defaultimage, hoverimage) {
     var SelectedColor = color;
     var DefaultUrl = defaultimage;
     var HoverUrl = hoverimage;
     $(".swatch_" + SelectedColor).click(function () {
         $(".swatch_" + SelectedColor).closest("ul").prev().attr({
             src: DefaultUrl,
                 "data-hover-src": HoverUrl
         });
     });
 }

Я попытался установить переменную HoverUrl как глобальную, опустив var, «сбросив» ее с помощью undefined в конце функции обновления изображения, но ничего не получилось. Как я могу решить эту проблему и есть ли более разумный способ сделать это, например. объединив все в одной функции?


jquery global-variables callback
person Socrates    schedule 02.05.2014    source источник

Ответы (1)


arrow_upward
1
arrow_downward

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

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

 HoverUrl = $this.attr('data-hover-src');
 DefaultUrl = $this.attr('src');
 $this.attr('data-hover-src',DefaultUrl );
 $this.attr('src', HoverUrl);
person TheNorthWes    schedule 02.05.2014