gpt4 book ai didi

javascript - meteor 覆盖包中元素的点击事件

转载 作者:数据小太阳 更新时间:2023-10-29 05:57:33 27 4
gpt4 key购买 nike

我正在尝试覆盖 autoform-remove-item 按钮的按钮单击事件,如下所示,因为我正在尝试显示警告消息(之前)用户可以删除 Autoform 数组中的任何项目。然后,如果用户确认删除项目,则按钮单击事件应正常继续。但是我无法弄清楚如何以暂停按钮下方代码(我无权访问)的方式覆盖按钮的点击事件,直到用户确认/拒绝删除?有什么帮助我可能在这里遗漏的吗?谢谢

    Template.salesInvoice.events({
'click .autoform-remove-item': function(e){

e.preventDefault();

bootbox.dialog({
message: "Are you sure you wish to delete this item?",
title: "New Journal",
buttons: {
eraseRecord: {
label: "Yes!",
className: "btn-danger",
callback: function() {

}
},
doNotEraseRecord: {
label: "No!",
className: "btn-primary",
callback: function() {
//Continue with the normal button click event

}
}

}
});
}

});

我试图覆盖的点击事件:

      'click .autoform-remove-item': function autoFormClickRemoveItem(event, template) {
var self = this; // This type of button must be used within an afEachArrayItem block, so we know the context

event.preventDefault();

var name = self.arrayFieldName;
var minCount = self.minCount; // optional, overrides schema
var maxCount = self.maxCount; // optional, overrides schema
var index = self.index;
var data = template.data;
var formId = data && data.id;
var ss = AutoForm.getFormSchema(formId);

// remove the item we clicked
arrayTracker.removeFromFieldAtIndex(formId, name, index, ss, minCount, maxCount);
},

最佳答案

兜兜转转一个多小时后,这就是我的发现。 Blaze 在 templateInstance 的父元素中安装它的事件监听器。它们存储的属性称为 $blaze_events。它易于使用,但没有记录。以下是您可以如何使用它:

检索事件处理程序

处理程序存储在一个数组中 ($blaze_events.handlers)。所以为了找到一个特定的,我写了这个函数:

retrieveBlazeEvent = function retrieveBlazeEvent (parentElement, eventType, selector) {
var returnHandler
parentElement.$blaze_events[eventType].handlers.forEach(function (eventHandler) {
if(eventHandler.selector === selector)
return (returnHandler = eventHandler) && false
})
return returnHandler
}

用法:

client/test.html

<template name="test">
<p>Hi!</p>
</template>

client/main.html

{{ > 测试}}

client/main.js

Template.test.events({
'click p': function () {
console.log('PIII')
}
})

retrieveBlazeEvent(document.body, 'click', 'p')

删除事件监听器

retrieveBlazeEvent 返回的事件处理程序有一个函数 unbind。所以这是一个例子

retrieveBlazeEvent(document.body, 'click', 'p').unbind()

调用此函数后,事件处理程序仍会存在。要还原它,您只需在同一对象上调用 bind

手动触发事件处理程序

假设我们有一个简单的 p 元素。正在监听点击事件:

Template.test.events({
'click p': function () {
console.log('PIII')
}
})

要触发事件处理程序,我们需要一个匹配此选择器的 p 元素。我们还需要模板实例来检索正确的父节点。然后我们需要以 View 作为其上下文来调用事件处理程序。我们还需要为事件绑定(bind)创建一个 stub ,其中包含 currentTarget。这个函数为你做所有这些:

triggerEvent = function triggerEvent (eventType, elementSelector, context) {
var context = context || document
var element = context.querySelector(elementSelector)
var eventStub = {
currentTarget: element
}
var view = Blaze.getView(element)
retrieveBlazeEvent(view._domrange.parentElement, eventType, elementSelector)
.delegatedHandler
.call(view, eventStub)
return true
}

关于javascript - meteor 覆盖包中元素的点击事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31088429/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com