Как явным образом выполнить действие по умолчанию из события jQuery

Следуя этому вопросу, я пытаюсь выполнить ненавязчивый диалог подтверждения.

$(document).ready(function () {
    $("[data-confirmPrompt]").click(function (event) {
        var confirmPrompt = event.currentTarget.attributes['data-confirmPrompt'].value;
        event.preventDefault();
        $.prompt(confirmPrompt, {
            buttons: { Yes: true, No: false },
            callback: function (v, m, f) {
                if (v) {
                    // User clicked Yes.  Unbind handler to avoid
                    // recursion, then click the target element again
                    $(event.currentTarget).unbind('click');
                    event.currentTarget.click();
                }
            }
        });
    });
});

Когда пользователь нажал кнопку "Да", я хочу, чтобы действие по умолчанию, связанное с событием, выполнялось. Я сделал это выше, отвязав обработчик jQuery и снова щелкнув элемент. Это отлично работает при отправке формы или переходе на другую страницу - но, конечно, не работает на страницах с поддержкой AJAX, где я хочу сохранить обработчик события jQuery.

Существует ли альтернативный общий способ выполнения действия по умолчанию? Логически что-то вроде event.executeDefault().

Ответ 1

Используя предложение Алексея Лебедева, сделанное в его втором комментарии, моя текущая реализация теперь выглядит как образец ниже, за исключением того, что я также добавил собственную реализацию локализации для ярлыков кнопок.

Примечания:

Теперь я использую виджет диалогового окна jqueryUI
Обратите внимание на использование .delegate, чтобы обработчик был "ajax-aware", т.е. работает с элементами, добавленными в DOM после загрузки страницы, например. в результате вызова AJAX
Использует флаг для предотвращения рекурсии, когда пользователь нажимает "Да" в диалоговом окне подтверждения.
Использует jquery 1.6.4 и jquery-ui-1.8.16

Если кто-нибудь может предложить улучшения, пожалуйста, перезвоните.

<!-- Examples of usage -->
<input type='submit' data-confirm="OK to delete customer 123?" ... />
<a href="..." data-confirm="OK to navigate?" ... />

<!-- Implementation -->
<script type="text/javascript">
    var confirmClickHandler = function (event) {
        if ($(event.currentTarget).data('isConfirming')) return;
        var message = event.currentTarget.attributes['data-confirm'].value;
        event.preventDefault();
        $('<div></div>')
                .html(message)
                .dialog({
                    title: "Confirm",
                    buttons: {
                        "Yes": function () {
                            $(this).dialog("close");
                            $(event.currentTarget).data('isConfirming', true);
                            event.currentTarget.click();
                            $(event.currentTarget).data('isConfirming', null);
                        },
                        "No": function () {
                            $(this).dialog("close");
                        }
                    },
                    modal: true,
                    resizable: false,
                    closeOnEscape: true
                });
    };

    $(document).ready(function () {
        $("body").delegate("[data-confirm]", "click", confirmClickHandler);
    });
</script>

Ответ 2

Я делаю что-то подобное, и это отлично работает для меня:

$('#link').click(function(e){
    if(!confirm('Are you sure you want to asdf?')){
        e.preventDefault();
    }
});

Ответ 3

Я честно не знаю, отвечает ли это на ваш вопрос, но это может немного помочь.

Рассмотрим следующий HTML:

<button onclick="alert('Hello world!');" class="btn">Test 1</button>
<button onclick="alert(this.className);" class="btn">Test 2</button>

Я добавил следующее в $(document).ready:

$('button').each(function() {
    var btn = $(this);
    var onClick = btn.attr('onclick');

    //replace this with _this
    onClick = onClick.replace(/this/g, "_this");

    btn.attr('onclick', '');

    btn.click(function() {
        if (confirm('Do it?')) {

            //set _this first!
            var _this = btn[0];

            eval(onClick);
        }
    });
});

Кажется, что эта работа выполнена. Проверьте этот пример jsFiddle: http://jsfiddle.net/KeesCBakker/4jThg/.

ИЗМЕНИТЬ
Я создал нечто похожее на ваш вопрос: http://jsfiddle.net/KeesCBakker/hqLH5/. Просто не мог понять, какой плагин $.prompt вы использовали, поэтому я схватил первую, найденную мной из github (это один работает только в Chrome: S).