当用户点击速度太快时,如何阻止此功能发生两次?
$(document).ready(function() {
$(".jTscroller a").click(function(event) {
event.preventDefault();
var target = $(this).attr("href");
$("#photo").fadeTo("fast", 0, function() {
$("#photo").attr("src",target);
$("#photo").load(function() {
$("#photo").fadeTo("fast", 1);
});
});
});
});
我遇到的问题是,如果用户点击得太快,元素将不会淡入,它只是保持隐藏状态。
问题不是我想的那样。当我点击相同的缩略图时,它会尝试加载相同的图像并永远加载。 .stop()
答案确实修复了双重动画,所以我接受了那个答案,但我的解决方案是检查最后点击的项目是否是当前显示的项目。新脚本:
$(document).ready(function() {
$(".jTscroller a").click(function(event) {
event.preventDefault();
var last = $("#photo").attr("src");
var target = $(this).attr("href");
if (last != target) {
$("#photo").stop().fadeTo("fast", 0, function() {
$("#photo").attr("src",target);
$("#photo").load(function() {
$("#photo").fadeTo("fast", 1);
});
});
};
});
});
最佳答案
嗯,您在描述中使用了正确的词。使用 stop()
$("#photo").stop().fadeTo("fast", 0, function() {
关于javascript - 在 jQuery 中防止双重动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11761011/