jQuery更新全局变量，这是其他函数中单击事件后的函数答案

【问题标题】：jQuery updating global variable which is a function after click event in other functionjQuery更新全局变量，这是其他函数中单击事件后的函数
【发布时间】：2014-05-03 04:54:16
【问题描述】：

我有一个脚本，当单击图像下方的缩略图时，它会更改几个列表元素的图像，想想颜色样本。该脚本正在交换 src 和自定义 data-hover-src 属性（主图像和悬停图像），HTML onclick 属性内的 jquery 函数变量由 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
         });
     });
 }

我尝试通过省略 var 将 HoverUrl 变量设置为全局变量，在更新图像函数的末尾使用 undefined “重置”它，但没有任何效果。我该如何解决这个问题，是否有更聪明的方法来解决这个问题，例如通过将所有内容组合在一个功能中？

【问题讨论】：

标签： jquery callback global-variables

【解决方案1】：

哇，这太酷了，花了我一点时间，但这似乎一直有效。 Fiddle

基本上，数据选择器似乎不适用于我们的情况。所以我用 attr 代替。也许混合它们才是真正的问题。

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

【讨论】：