防止触发JQuery的多次点击事件 [英] Prevent multiple click events firing JQuery

问题描述

在这种情况下，我的内容是基于一个类异步加载的.因此，如果我有一个与ajaxLink类的链接，则它将按以下方式触发:

Here's the scenario, my content is loaded asynchronously based on a class. So if I have a link with the class ajaxLink it fires as below:

$('a.ajaxLink').click(function (e) {
        e.preventDefault();
        var container = $(this).parents('div.fullBottomContent');
        var href = $(this).attr('href');
        container.fadeOut('fast', function () {
            $.ajax({
                url: href,
                dataType: "html",
                type: "GET",
                success: function (data) {
                    container.html(data);
                    BindEventHandlers();
                    container.fadeIn();
                    $.validator.unobtrusive.parse('form');
                },
                error: function () {
                    alert('An error has occurred');
                }
            });
        });

    });

所有可爱.现在，在一个实例中，我想向用户显示警告confirm，他们要加载页面并放弃所有更改，所以我这样写:

All lovely. Now in one instance I want to display a warning to the user to confirm that they want to load the page and loose all their changes so I've written this:

$('a.addANewHotel').click(function (e) {
        if (!confirm('Adding a new hotel will loose any unsaved changes, continue?')) {
            e.stopPropagation();
        }
    });

现在我已经尝试过return false，e.preventDefault()和e.stopPropagation();，但是无论第一种方法总是被触发吗?如何防止额外的点击事件触发?这是事件的顺序吗?

now I've tried return false, e.preventDefault() and e.stopPropagation(); but no matter what the first method is always fired? How can I prevent the extra click event from firing? Is this an order of events thing?

看不到它的相关性，但是我的HTML是:

Don't see how this is relevant but my HTML is:

<a style="" href="/CMS/CreateANewHotel?regionID=3&amp;destinationID=1&amp;countryName=Australia" class="button wideBorderlessButton ajaxLink addANewHotel">Add a new hotel</a>

推荐答案

您是否尝试过:event.stopImmediatePropagation?

我相信这就是您要寻找的东西:

I believe it is what you are looking for:

http://api.jquery.com/event.stopImmediatePropagation/

$('a.addANewHotel').click(function (e) {
        if (!confirm('Adding a new hotel will loose any unsaved changes, continue?')) {
            e.stopImmediatePropagation();
            e.preventDefault();
        }
    });

这篇关于防止触发JQuery的多次点击事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！