如何在短时间延迟后触发点击

How to trigger click after a short delay

本文关键字：时间延迟      更新时间：2023-09-26

我正在构建一个骨干应用程序，我的视图是这样的

define(function (require) {
    'use strict';
    var MyBackbone      = require('mybackbone'),
        template        = require('utils/template'),
        Handlebars      = require('handlebars'),
        Contest          = require('controllers/ads/contest');
    var Main = MyBackbone.View.extend({
        initialize : function( options ) {
            MyBackbone.View.prototype.initialize.apply(this, [options]);
            this.template = Handlebars.compile( template.get( "presentation/page/main" ) );
            this.loadChildViews( "footer", new Contest() );
        },
        render: function(){
            var renderedContent = this.template();
            this.$el.html( renderedContent );
            return this;
        },
        events: {
            "click .show-message": "hideAndShowMessage"
        },
        hideAndShowMessage: function(e){
            var self = this;
            e.preventDefault();
            this.$el.find('.is-hidding:visible').addClass('hideFade');
            this.$el.find('.bg-lets-go').removeClass('hideFade');
            var targetLink = $(e.currentTarget);
            targetLink.removeClass('show-message');
            setTimeout(function(){
                $('a.no-style:not(".show-message")', self.$el).trigger("click");
                //$('a.no-style:not(".show-message")').click();
                //targetLink.trigger('click');
            }, 750);
        }
    });
    return Main;
});

和我的主玉

div.main-container
    .container-fluid.is-hidding
        .row
            .col-xs-6
                a.no-style.btn-ipurpose.show-message(href="/#ipurpose")
                    i.fa.fa-tree.fa-3x
                    | JE PROPOSE
            .col-xs-6
                a.no-style.btn-ichoose.show-message(href="/#ichoose")
                    i.fa.fa-flag-checkered.fa-3x
                    | JE CHOISIS
.bg.bg-lets-go.is-hidding.hideFade
.bg.bg-simple

目标是在点击链接后750毫秒内显示"let's go message"。

我已经尝试了一些东西进入setTimeout，但没有一个工作。没有javascript错误，这样做是正确的吗?

在我看来你的逻辑是错误的。

您再次将单击事件发送到之前单击的同一锚。侦听器仍将绑定到此元素，从而再次调用hideAndShowMessage。在该方法中，您再次调用e.p preventdefault()。你开始超时之后，点击被发送，我们重新开始;基本上就是一个无限循环。

您的问题的一个快速解决方案是使preventDefault调用有条件:

var targetLink = $(e.currentTarget);
if(targetLink.hasClass(".show-message")) {
    e.preventDefault();
    //....rest of your logic
}

这应该能成功!

相关文章：