Javascript 带有Jquery脚本的setInterval()
首先,我要感谢那些迄今为止在这个脚本方面帮助过我的人,你们在学习javascript和jquery的一些更优雅的方面都给了我巨大的帮助 这个脚本还有最后一个问题,我使用setinterval()在图像转换器中循环,JS/Jquerycode如下所示:Javascript 带有Jquery脚本的setInterval(),javascript,jquery,Javascript,Jquery,首先,我要感谢那些迄今为止在这个脚本方面帮助过我的人,你们在学习javascript和jquery的一些更优雅的方面都给了我巨大的帮助 这个脚本还有最后一个问题,我使用setinterval()在图像转换器中循环,JS/Jquerycode如下所示: $(function() { var rotateTimer = setInterval(rotateImg,15000); $('#feature-links a').click(function() { if (!$(this).ha
$(function() {
var rotateTimer = setInterval(rotateImg,15000);
$('#feature-links a').click(function() {
if (!$(this).hasClass('a-active')) {
clearInterval(rotateTimer);
switchToImg($(this).attr('class'));
}
});
function switchToImg(image) {
var $featureImage = $('#feature-image');
$featureImage.fadeOut(200, function() {
$featureImage.css('background-image', 'url(images/main_' + image + '.jpg)').fadeIn(200);
$('#feature-detail div').removeClass('d-active').filter('.d' + image).addClass('d-active');
});
$('#feature-links a').removeClass('a-active').filter('.' + image).addClass('a-active');
};
function rotateImg() {
var next = 'a' + (parseInt($('#feature-links a.a-active').attr('class').match(/[0-9]/))+parseInt(1));
if (!$('#feature-links a').hasClass(next))
next = 'a1';
switchToImg(next);
}
});
此脚本适用于允许用户手动切换到图像的
标记的类名。除此之外,rotateImg()
在setInterval()
的帮助下,每15秒提供一次自动图像/文本循环
我遇到的问题是,一旦用户手动单击链接,就会重新初始化setInterval()
在.click
函数中,我清除了间隔计时器,然后调用switchToImg()
函数,调用的类名称为
标记,该标记作为变量传递
我正在尝试解决如何重新设置计时器,以避免用户在循环结束时单击链接并立即切换到下一个图像
我已经研究过在toswitchToImg()
中构建我自己的回调函数,这样一旦函数完成,计时器就会被重置,理想情况下,我希望最初的时间更长(例如30秒),然后回到15秒的时钟。然而,我的研究让我找到了一大堆不同的知识库,我很难理解它们
关于如何将此功能构建到脚本中的任何指导都非常有用。谢谢您的时间。:) 我不能100%确定我是否遵循了您的要求,但如果您尝试的是在用户单击后延迟一段时间后重新启动间隔计时器,那么您可以这样做:
$('#feature-links a').click(function() {
if (!$(this).hasClass('a-active')) {
clearInterval(rotateTimer);
switchToImg($(this).attr('class'));
setTimeout(function() {
rotateTimer = setInterval(rotateImg, 15*1000);
}, 15*1000);
}
});
您将使用一次性的setTimeout()
调用在15秒延迟后重新启动间隔计时器。这将给您15+15=30秒的时间,单击后下一个图像将再次切换,然后每次切换15秒。不确定我是否正确理解了问题。但基本上我明白了,你想要阻止计时器在用户点击后发生。在switchToImg之后调用setInterval不就应该这样做吗?它会在用户点击后每隔15秒调用switchToImg。好吧,在不完全知道我要求什么的情况下,你就一针见血了。谢谢,这很有效!作为旁注:parseInt($('.#功能链接a.a-active').attr('class').match(/[0-9]/)+parseInt(1)
应该是parseInt($('.#功能链接a.a-active').attr('class').match(/[0-9]/),10)+1
。将数字(在本例中为10
)的(基数)作为第二个参数,这是可选的,但建议使用。另外,parseInt(1)
是完全没有用的。谢谢你,火箭,我希望有人会评估这段代码,知道基数非常有用,谢谢。我会把我的密码加密+1如果您忘记了基数,大多数浏览器都会返回正确的值,但您不能总是确定。:-)