Javascript：取消或让事件继续？

Question

我的场景涉及 Kendo UI，但我认为它可能普遍适用于 JavaScript，因此 JavaScript 标记。

我有一个 Kendo 调度程序，其编辑事件选项设置为 functionA。

在 functionA 中，我创建了一个向用户提问的 Kendo 窗口（基本上是一个模式）；在一种情况下，编辑事件应该继续并冒泡，就好像模式从未存在过一样，在另一种情况下，它应该阻止默认并返回。

问题是模态是非阻塞的，所以确认模态出现了，但事件逻辑继续并冒泡到编辑器的内置编辑事件。

如何捕获和暂停当前事件，并且只有在我从 Kendo 窗口中获得所需结果时才继续它？

我知道由于 JavaScript 的单线程特性，我不能也不应该使 Kendo 窗口阻塞，但是有没有办法让这个事件暂停，只有在我这样说的情况下才能恢复它。

基本上，我想做event.Hold()之类的事情，如果满足条件，则event.Resume()，否则，执行event.preventDefault()。

Answer 1

更新

我测试了我之前发布的代码，发现它不能正常工作。这是经过测试的，可以完全按照您的要求工作，而且它是一种解决方案：

var event_store;

function handle_click(event) {
    event.stopPropagation();
    event_store = event;

    //Open the modal here
    //If it's possible, pass the event pointer to the modal's confirm callback
    //instead of using event_store and pass that pointer to fire_event() when
    //it's confirmed
}

function confirm_handle() {
    resume_event("click");
}

function resume_event(type) {
    if (event_store.target.parentNode) {
        var event;

        if (document.createEvent) {
            event = document.createEvent("HTMLEvents");
            event.initEvent(type, true, true);
        } else {
            event = document.createEventObject();
            event.eventType = type;
        }

        event.eventName = type;

        if (document.createEvent) { //Not IE
            event_store.target.parentNode.dispatchEvent(event);
        } else { //IE
            event_store.target.parentNode.fireEvent("on" + event.eventType, event);
        }
    }
}

上一个

您可以使用类似的方法来“暂停”事件冒泡。它取消事件传播并在调用单击处理程序时显示模式并将 show_modal 变量设置为 false。在确认调用 fire_event() 并触发原始事件后，这次不显示模态，然后将 show_modal 重置为 true。如果用户未确认模式，您还应该将 show_modal 恢复为 true。

var show_modal = true;
var event_store;

function handle_click(event) {
    event.stopPropagation();
    event_store = event;

    show_modal = !show_modal;
    if (show_modal) {
        //Open the modal here
        //If it's possible, pass the event pointer to the modal's confirm callback
        //instead of using event_store and pass that pointer to fire_event() when
        //it's confirmed
    }
}

function fire_event() {
    if (document.createEvent) { //Not IE
        element.dispatchEvent(event_store);
    } else { //IE
        element.fireEvent("on" + event_store.eventType, event_store);
    }
}

Answer 2

你真正应该做的是

1. 在显示对话框之前在处理程序中调用 e.preventDefault()
2. 当你的对话被确认（或者被拒绝，我不知道要求）后，使用API​​方法开始编辑调度器事件

这应该可以帮助您开始（仅适用于第一次编辑；您需要在某个地方重置 _confirmed 条件）：

edit: function (e) {
    if (!this._confirmed) {
        e.preventDefault();

        // your dialog logic here..
        if (window.confirm("Confirm edit?")) {
            this._confirmed = true;
            // in your code, you probably won't need the setTimeout wrapper
            setTimeout(function () { 
                $("#scheduler").getKendoScheduler().editEvent(e.event);
            }, 5);
            // at some point, you'll probably want to reset this._confirmed
        }
    }
},

(see it work)