我对 jQuery 和图像有点问题。
我正在尝试创建一个简单的系统,其中图像在悬停时会发生变化(我已经成功地使用 jQuery .hover()),但是我现在正在尝试设置它,以便如果用户单击图片,源将永久更改为悬停图片。
我遇到的问题是,当我点击时,来源发生了变化,但是当我悬停时,它又变回“关闭”图像!这么简单的问题,但我找不到解决方案。
悬停代码:
$("#image").hover(function () {
$(this).attr("src", getImageSourceOn("image"));
}, function () {
$(this).attr("src", getImageSourceOff("image"));
});
函数 getImageSourceOn/Off 只是根据带有新来源的参数返回一个字符串。
点击代码:
var imageSource = $(imageID).attr("src");
var onOff = imageSource.substring((imageSource.length - 5), (imageSource.length - 4));
if (onOff == "F")
{
//alert("Off\nstrID = " + strID);
$(imageID).attr("src", getImageSourceOn(strID));
}
else
{
//alert("On");
$(imageID).attr("src", getImageSourceOff(strID));
}
此代码仅获取源代码并在源代码中查找 On/Off 以将相反的图像放置。我尝试使用 .toggle() 而不是此子字符串方法,但我无法让它工作。
最佳答案
声明一个全局变量。在 click
事件上附加一个函数:
var clicked = false;
$("#image").click(function(){
if(!clicked)
clicked = true;
else
$(this).attr("src", getImageSourceOff("image"));
});
然后修改你的hover
代码
$("#image").hover(function () {
$(this).attr("src", getImageSourceOn("image"));
}, function () {
if(!clicked)
$(this).attr("src", getImageSourceOff("image"));
});
关于javascript - jQuery 在悬停时更改图像,然后在单击时保持图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7386458/