代码之家 › 专栏 › 技术社区 › Bjørn Furuknap

在jquery中挂起默认事件

jquery javascript

Bjørn Furuknap · 技术社区 · 15 年前

我试图延迟jquery脚本中的一个或多个默认事件。上下文是,我想在用户执行某些操作(主要是单击)几秒钟后,在默认操作触发之前,向用户显示一条消息。

伪代码: -用户点击链接/按钮/元素 -用户收到一条弹出消息,说明“您正在离开网站” -消息在屏幕上停留x毫秒 -默认操作(也可以是除Href Link之外的其他操作)激发

到目前为止,我的尝试是这样的:

$(document).ready(function() {
    var orgE = $("a").click();
    $("a").click(function(event) {
        var orgEvent = event;
        event.preventDefault();
        // Do stuff
        doStuff(this);

        setTimeout(function() {
            // Hide message
            hideMessage();
            $(this).trigger(orgEvent);
        }, 1000);
    });
});

当然,这并不像预期的那样有效,但可能会显示出我在做什么。

我无法使用插件,因为这是一个托管环境,没有在线访问。

有什么想法吗?

4 回复 | 直到 15 年前

DLH 15 年前

我可能会做这样的事。

$("a").click(function(event) {
   event.preventDefault();
   doStuff(this);
   var url = $(this).attr("href");

   setTimeout(function() {
      hideMessage();
      window.location = url;
   }, 1000);
});

我不确定 url 从计时功能内部可以看到。否则,您可能需要在click处理程序之外声明它。

编辑: 如果需要从timed函数触发事件,可以使用类似于karim79建议的方法,尽管我会做一些更改。

$(document).ready(function() {
  var slept = false;
  $("a").click(function(event) {
    if(!slept) {
        event.preventDefault();
        doStuff(this);

        var $element = $(this);
        // allows us to access this object from inside the function

        setTimeout(function() {
          hideMessage();
          slept = true;
          $element.click(); //triggers the click event with slept = true
        }, 1000);
        // if we triggered the click event here, it would loop through
        // this function recursively until slept was false. we don't want that.
    } else {
        slept = false; //re-initialize
    }
  });
});

编辑: 经过一些测试和研究,我不确定是否有可能触发 <a> 元素。除了 <a> 是的。

VoteyDisciple 15 年前

像这样的事情应该能解决问题。向所有要受影响的链接添加一个新类(可能比我选择的更合理的名称)。显示弹出窗口后删除该类,因此再次调用.click()时,代码将不再运行,并且将发生默认行为。

$("a").addClass("fancy-schmancy-popup-thing-not-yet-shown").click(function() {
    if ($(this).hasClass("fancy-schmancy-popup-thing-not-yet-shown"))
        return true;

    doStuff();
    $(this).removeClass("fancy-schmancy-popup-thing-not-yet-shown");

    var link = this;
    setTimeout(function() {
      hideMessage();
      $(link).click().addClass("fancy-schmancy-popup-thing-not-yet-shown";
    }, 1000);

    return false;
});

scruffian 14 年前

可能最好的方法是使用unbind。类似于:

$(document).ready(function() {
    $("a").click(function(event) {
        event.preventDefault();
        // Do stuff
        this.unbind(event).click();
    });
})

-2

Jim Neath 15 年前

这可能有效:

$(document).ready(function() {
  $("a").click(function(event) {
    event.preventDefault();
    doStuff(this);

    setTimeout(function() {
      hideMessage();
      $(this).click();
    }, 1000);
  });
});

注:完全未经测试