jQuery触发元素循环点击

3

我有页面中的元素:

<a class="element" onclick="do this"></a>
<a class="element" onclick="do this"></a>
<a class="element" onclick="do this"></a>
<a class="element" onclick="do this"></a>

我需要触发每个元素的点击事件,并在触发的点击事件之间添加一些延迟时间。
//for each one .element
$('.element').delay(800).trigger('click');

我需要无限循环这个过程,但当用户点击一个 .element 时,我需要停止它。

我尝试了许多方法,如 $.each(循环触发器); ,但我不知道如何将其循环无限,并在我想要停止时停止它 :(

2个回答

0

可能存在更优雅的解决方案,但这是我的建议:

​$(function(){
    $("a").on("click", function(e, d){
        $(this).addClass("active").siblings().removeClass("active");
        if(d !== true) {
            clearInterval(timer);
        }
    });

    $("a:first").addClass("active");
    var timer = setInterval(doClick, 800);

    function doClick() {
        var $n = $(".active").next();
        if ($n.length == 0) {
            $n = $(".active").siblings().first();
        }
        console.log($n.length);
        $n.trigger("click", [true]);
    }
});
​

jsFiddle


我只是使用 onclick="",所以我只需要循环触发每个元素的触发方法,我不能重新声明 on('click')。 - user895171
我只需要在一个无限循环中触发每个 .element 的点击,然后如果用户点击了 1 个 .element,则停止循环。 - user895171

0

我的解决方案:

$(function(){
    var links = $('.element');

    var timer = setInterval(function(){
        links.each(function(index, value){
            var link = $(this);
            setTimeout(function(){
                link.trigger('click', "trigger");
            }, 100 + index * 50);
        });
    }, 800);

    links.click(function(e, isTrigger){
        e.preventDefault();
        if(!isTrigger)
        {
            clearInterval(timer);
        }
    });
});

演示:http://jsfiddle.net/c2G6q/1/

你不要无限循环!:) 这会很棒! - user895171
不好意思,我以为我的问题已经很清楚了... :( 我只需要在一个无限循环中触发每个 .element 的点击事件,然后如果用户点击了 1 个 .element,则停止循环。 - user895171
1
@Aaaaaaa 或者这个示例:http://jsfiddle.net/c2G6q/2/ 点击链接后触发器将停止。 - webdeveloper
嗯,在Fiddle上对我有效,但是不行 :( 可能是因为我正在使用 var links = $('.home-present a') ?? - user895171
@Aaaaaaa 打开控制台并检查您的选择器。该选择器将选择一个带有.home-present类的元素,然后在其中查找链接(子元素)。 - webdeveloper
显示剩余3条评论

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接