jQuery每x秒运行一次点击功能

本文介绍了jQuery每x秒运行一次点击功能的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我有以下jQuery

I have the following jQuery

<script type="text/javascript"> jQuery(function(){ jQuery('.link1').click(function(){ jQuery('.hide-div').hide(); jQuery('.toggle1').show(); jQuery('#arrow').css({top: '0px'}); }); jQuery('.link2').click(function(){ jQuery('.hide-div').hide(); jQuery('.toggle2').show(); jQuery('#arrow').css({top: '42px'}); }); jQuery('.link3').click(function(){ jQuery('.hide-div').hide(); jQuery('.toggle3').show(); jQuery('#arrow').css({top: '84px'}); }); jQuery('.link4').click(function(){ jQuery('.hide-div').hide(); jQuery('.toggle4').show(); jQuery('#arrow').css({top: '125px'}); }); jQuery('.link5').click(function(){ jQuery('.hide-div').hide(); jQuery('.toggle5').show(); jQuery('#arrow').css({top: '166px'}); }); jQuery('.link6').click(function(){ jQuery('.hide-div').hide(); jQuery('.toggle6').show(); jQuery('#arrow').css({top: '207px'}); }); }); jQuery(function(){ jQuery("#toggle-links ul > li > a").click(function(e){ e.preventDefault(); jQuery("#toggle-links ul > li > a").addClass("selected").not(this).removeClass("selected"); }); }); </script>

并且需要添加一个函数，该函数将每隔3秒按顺序运行link1，link2，link3 ...，直到到达link6，然后它将循环回到link1，并且如果用户将鼠标悬停在div上使用ID #holder时，该功能将停止运行，直到将鼠标移出为止.我有些困惑，要这样做吗?

And need to add a function which will run the click functions in order link1, link2, link3... every 3 seconds until it gets to link6 then it will loop back to link1 and if a user was to hover over a div with the id #holder the function would stop running until mouseout. I am a bit stumped over as to do this, any ideas?

推荐答案

尝试:

var interval = null; jQuery(function(){ interval = setInterval(callFunc, 3000); }); function callFunc(){ jQuery('.link1, .link2, .link3').trigger('click'); }

任何时候您都可以通过以下方式停止自动点击:

Any time you can stop auto clicks by calling:

clearInterval(interval);

要按顺序调用它们，可以按如下所示修改代码:

To call them in order, you can modify your code like this:

jQuery('.link1').click(function(){ jQuery('.hide-div').hide(); jQuery('.toggle1').show(); jQuery('#arrow').css({top: '0px'}); // click link2 jQuery('.link2').trigger('click'); }); jQuery('.link2').click(function(){ jQuery('.hide-div').hide(); jQuery('.toggle2').show(); jQuery('#arrow').css({top: '42px'}); // click link3 jQuery('.link3').trigger('click'); });