停止 onclick 事件处理程序

Question

我有一些工作代码，我现在在稍微不同的上下文中使用它们。 工作部分是我使用对象 onclick 事件来调出一个表单来发送电子邮件。 当它在 HTML 页面中时，它工作正常。 我会有很多看起来像这样的按钮：

<button id="mail-c1" onclick="initMailFormButton(this.id, 'someone','somedomain.com','a subject')">Someone's Name</button>

整个表单是在 javascript 中创建的，有自己的提交和取消按钮，但位于按钮元素内。 为了能够在表单中输入数据，我需要终止 onclick 事件，然后在提交或取消电子邮件后恢复它。 onclick 处理程序开始于：

function initMailFormButton(mailId, eName, eDomain, eSubject) {
    myFormLocation = document.getElementById(mailId);
    stopFormClick(myFormLocation);

其中 stopFormClick 函数是：

function stopFormClick(myFormLocation) {
    saveOnclick = myFormLocation.onclick;
    myFormLocation.onclick = null;
}

这有一个错误，它不能处理某人一次打开多个表单，但这不是我的直接关注点。 我会在这次讨论之外修复它。

生成的表单中的提交和取消按钮都恢复了 onclick 事件处理程序，因此您可以非常愉快地多次打开和关闭表单。

我的新案例是我从数据库生成 HTML 页面。 我正在使用 HTML 数据集来存储以前的硬编码信息，如下所示：

    emailButton.setAttribute("data-mailname",   emailName);
    emailButton.setAttribute("data-maildomain", emailDomain);
    emailButton.addEventListener("click", function() { initMailFormButton(this.id, this.dataset.mailname, this.dataset.maildomain, ""); }, false);

正在检索的信息是正确的，并且表单出现在正确的位置。 但是，我无法输入信息，因为当我在第一个表单字段中单击并生成另一个表单时，原始的 onclick 处理程序会启动...

我唯一的线索是，当我查看保存在静态 HTML 页面中的 onclick 事件的值时，它具有预期值，但在生成的页面中为空。 我觉得这很令人困惑，因为我将（唯一的）元素 id 传递给例程，因此它应该到达正确的元素。

任何人都可以帮助我解决这个问题。 同时，我将修复我上面提到的事件处理程序错误。

Answer 1

好的。 所以这是click和onclick之间的区别。 未设置 onclick 事件处理程序，因此它为空。 我将单击事件侦听器的设置更改为将 onclick 属性设置为：

    emailButton.onclick = 
        function() { initMailFormButton(this.id, this.dataset.mailname, this.dataset.maildomain, ""); };

一切正常。

为了处理我之前提到的限制，我将 saveOnclick 变量变成了一个由按钮 id 键控的关联数组。 现在人们可以点击任意数量的按钮——尽管想要拥有多个按钮的情况可能很少见。