javascript - jQuery - 如何删除 .submit() 和 .focus() 事件

Question

保存这些事件的函数在每次打开弹出窗口时调用

我有一个函数需要在一个页面上多次调用。该函数包含一些 .on("click", function.... 事件。

为了不向同一元素添加越来越多的点击事件，我在每个 .on("click", 之前添加了 .off("click", 哪个(我理解)是处理这个问题的正确方法？

我的函数还有以下内容:$("#myForm").submit(函数(e){...和...$("#myTextArea").focus(函数(e){...

我的问题是:我是否需要像执行“单击”功能一样“解除绑定(bind)”(为了更好的词).submit 和.focus 功能，以便在每次调用该功能时停止这些事件在这些元素上相乘？

而且，如果我这样做，正确的方法是什么？

非常感谢

约翰 :-)

** 更新 **我已按要求提供了更多详细信息。

我的页面包含 3 个由 3 个独立按钮启动的弹出窗口。弹出窗口开始时只有一个“loading.gif”。当单击每个按钮时，我测试“loading.gif”是否在窗口中处于事件状态，如果是，我使用 ajax 请求为该窗口获取正确的 HTML。

一旦我的 ajax 请求返回 HTML，我将其附加到窗口，然后调用此函数将事件绑定(bind)到相关按钮/表单等。

如果他们随后关闭该窗口并打开其他弹出窗口之一，我需要重新调用该函数，因此要确保我不会在每个 HTML 元素的事件上加倍。因此，我先关闭事件 .off，然后再将它们放回 .on。

希望澄清问题背后的原因，但如果不清楚，请随时询问。我还认为指出我是 jQuery 的新手(实际上是一般的 javascript)是明智的，所以这当然不一定是实现此功能的最佳/唯一方法。这正是我在编写代码时认为有意义的方式。

最初我让弹出窗口预先填充了 HTML 但隐藏了，但我发现那样我的页面大小非常大，我想缩短加载时间等。

---

Answer 1

你可以按照你现在的方式去做。您还可以使用 jQuery 委托(delegate)系统。

示例:

您有一个 div(我们称它为 #test)并在其中添加了一些按钮。你删除按钮，你再次添加它们......但是你想在它们上绑定(bind)一个点击事件。你可以这样做:

$('#test').on('click', 'button', function(event) {
    // Do what you want. this == the clicked button
    $(this).css('background-color', 'red');
});

解释:

点击事件绑定(bind)在 #test 上，但 jQuery 将针对 css 选择器 button 测试点击的目标。而 this 将成为点击的目标(不是 #test)。这样您只需创建一次点击监听器，而不必在每次创建按钮时都添加/删除它。