我有这个jQuery代码我用点击功能编写.
代码必须与jQuery 1.7.2一起使用.
我在这里设置了一个jsfiddle：http://jsfiddle.net/7MpTa/1/
$(document).ready(
function () {
$(".balloons a").hover(
function() {
$(this).next('.popups').addClass("shown");
},function() {
$(this).next('.popups').removeClass("shown");
}
);
}
);
当我将点击功能切换为悬停时,它可以正常工作.只是点击功能本身不起作用.我试过改变它来绑定和生活,但没有成功.
这是悬停工作的演示：http://jsfiddle.net/8HL8k/1/
任何人都知道它为什么不起作用？
编辑
谢谢大家的回答.他们显然都很棒.但是,当在网站上实现这些更改时,事件根本就没有被触发(在FF,IE7,Chrome,Opera,Safari上测试).在类(气球和弹出窗口)的任何地方绝对没有其他参考,所以我不确定什么可能导致干扰.由于严格的NDA政策,我无法将链接发布到网站.这些都在无序列表(ul)中.它可能是由这种HTML语法引起的吗？如果是这样,有办法解决吗？因为它必须保留在内部,因为代码用于整个站点的数百个幻灯片.
我也尝试让锚点在点击时发出警报,看它是否会触发它,它也没有触发它.
解决方法
您可以使用toggle()而不是click()：
$(".balloons a").toggle(
function() {
$(this).next('.popups').addClass("shown");
},function() {
$(this).next('.popups').removeClass("shown");
}
);
正如你在这里看到的：http://jsfiddle.net/darkajax/tmzt7/
但是请记住,toggle()从jQuery 1.8开始被弃用,并在1.9中被删除,但由于你使用的是1.7.2,它应该可以正常工作……
但是,更好的解决方案是使用toggleClass()：
$(".balloons a").click(
function() {
$(this).next('.popups').toggleClass("shown");
}
);
正如你在这里看到的：http://jsfiddle.net/darkajax/GeSmx/
