使用event.preventDefault（）后如何触发事件

Question

我想举行一个活动，直到我准备解雇它为止$('.button').live('click', function(e){   e.preventDefault();    // do lots of stuff   e.run() //this proceeds with the normal event    }是否有与上述run()功能等效的功能？

Answer 1

不。一旦事件被取消，便被取消。

不过，您可以稍后使用标志来确定您的自定义代码是否已经运行，从而重新触发该事件-像这样（请忽略公然的名称空间污染）：

var lots_of_stuff_already_done = false;

$('.button').on('click', function(e) {

    if (lots_of_stuff_already_done) {

        lots_of_stuff_already_done = false; // reset flag

        return; // let the event bubble away

    }

    e.preventDefault();

    // do lots of stuff

    lots_of_stuff_already_done = true; // set flag

    $(this).trigger('click');

});

更通用的变体（具有避免全局名称空间污染的附加好处）可以是：

function onWithPrecondition(callback) {

    var isDone = false;

    return function(e) {

        if (isDone === true)

        {

            isDone = false;

            return;

        }

        e.preventDefault();

        callback.apply(this, arguments);

        isDone = true;

        $(this).trigger(e.type);

    }

}

用法：

var someThingsThatNeedToBeDoneFirst = function() { /* ... */ } // do whatever you need

$('.button').on('click', onWithPrecondition(someThingsThatNeedToBeDoneFirst));

额外的超简约jQuery插件，Promise支持：

(function( $ ) {

    $.fn.onButFirst = function(eventName,         /* the name of the event to bind to, e.g. 'click' */

                               workToBeDoneFirst, /* callback that must complete before the event is re-fired */

                               workDoneCallback   /* optional callback to execute before the event is left to bubble away */) {

        var isDone = false;

        this.on(eventName, function(e) {

            if (isDone === true) {

                isDone = false;

                workDoneCallback && workDoneCallback.apply(this, arguments);

                return;

            }

            e.preventDefault();

            // capture target to re-fire event at

            var $target = $(this);

            // set up callback for when workToBeDoneFirst has completed

            var successfullyCompleted = function() {

                isDone = true;

                $target.trigger(e.type);

            };

            // execute workToBeDoneFirst callback

            var workResult = workToBeDoneFirst.apply(this, arguments);

            // check if workToBeDoneFirst returned a promise

            if (workResult && $.isFunction(workResult.then))

            {

                workResult.then(successfullyCompleted);

            }

            else

            {

                successfullyCompleted();

            }

        });

        return this;

    };

}(jQuery));

用法：

$('.button').onButFirst('click',

    function(){

        console.log('doing lots of work!');

    },

    function(){

        console.log('done lots of work!');

    });

Answer 2

isDefaultPrevented像这样覆盖属性：

$('a').click(function(evt){

  evt.preventDefault();

  // in async handler (ajax/timer) do these actions:

  setTimeout(function(){

    // override prevented flag to prevent jquery from discarding event

    evt.isDefaultPrevented = function(){ return false; }

    // retrigger with the exactly same event data

    $(this).trigger(evt);

  }, 1000);

}

恕我直言，这是使用完全相同的数据重新触发事件的最完整方法。