我试图做一个简单的图像交换,但当我添加我的代码为交换,它不工作!我有一个函数切换使用CSS动画的不同类,这些类不用图像交换代码就能很好地工作,但是一旦我将它添加到所有这些类中,就会中断!
有人能很快解决我的代码问题吗?我觉得我的JQuery逻辑有点不对劲。
jQuery(document).ready(function () {
var toggle = 0;
var toggleClass = function () {
toggle = !toggle;
$(".two").toggleClass("two-menu", toggle);
$(".four").toggleClass("four-menu", toggle);
$(".images").toggleClass("images-menu", toggle);
$(".home").toggleClass("home-menu", toggle);
$("#bottom-left").toggleClass("bottom-left", !toggle);
$("#bottom-right").toggleClass("bottom-right", !toggle);
$("#margin-zero").toggleClass("margin-zero", !toggle);
$(".left-container").toggleClass("left-container-show", toggle);
$(".right-container").toggleClass("right-container-show", toggle);
}
var imageSwap = function () {
this.src = '/wp-content/uploads/2013/11/Twitter.jpg';
}, function () {
this.src = '/wp-content/uploads/2013/11/Facebook.jpg';
}
jQuery(".home").click(function () {
toggleClass();
});
jQuery(".two").click(function () {
toggleClass();
imageSwap();
});
jQuery(".four").click(function () {
toggleClass();
});
});
我创建了两个JSFiddles。
1)第一种方法不起作用,包括imageSwap
函数。http://jsfiddle.net/MuQ2w/
2)第二种方法没有imageSwap
,工作非常完善。http://jsfiddle.net/E2Rzv/
发布于 2014-01-20 12:03:53
您所遇到的问题是jQuery imageSwap函数的语法问题,因为您不能编写两个用“逗号”分隔的函数。我认为一个可能的解决方案可能是删除第二个函数。另外,imageSwap函数不知道“这”,因为它超出了它的范围。你需要把“这”作为论据传递给它。因此,最终的imageSwap函数如下所示:
var imageSwap = function ($this) {
$this.src = '/wp-content/uploads/2013/11/Facebook.jpg';
}
你对这个函数的调用就像:
jQuery(".two").click(function () {
imageSwap(this);
toggleClass();
});
我希望这会有所帮助。
为了遵循这一传统,这里有一个有用的小提琴:jsfiddle.net/gKxLz
发布于 2014-01-20 10:28:12
你在控制台里查找错误了吗?
var imageSwap = function () {
this.src = '/wp-content/uploads/2013/11/Twitter.jpg';
}, function () {
this.src = '/wp-content/uploads/2013/11/Facebook.jpg';
}
语法不正确:第二个函数没有变量名。
发布于 2014-01-20 10:29:26
如果不调试代码,就很难搞清楚正在发生什么。
我猜想这个问题可能是由于imageSwap函数中“这个”的范围造成的。
尝试将此(对于处理程序)作为参数传递给imageSwap函数,如下所示:
var imageSwap = function ($this) {
$this.src = '/wp-content/uploads/2013/11/Twitter.jpg';
}, function ($this) {
$this.src = '/wp-content/uploads/2013/11/Facebook.jpg';
}
jQuery(".two").click(function () {
toggleClass();
imageSwap(this, this);
});
希望它能成功
https://stackoverflow.com/questions/21241273
复制相似问题