Question

好的，我正在构建一个网页，我已经开始使用JQuery并且我经常使用它听众（keyup，focusin，focusout ......）

我对它们的存储方式有疑问。

我拥有的其中一个页面有动态内容，用户选择日期，php脚本返回表格中的一堆数据。在那些表上我有一个javascript函数，当按下一个单元格时，一个区域打开，我用表单的html代码加载它。这种形式对于每个单元格都是相同的，它只是根据按下的单元格改变时间和日期。我的解决方案是这个html是使用提到的javascript函数编写的。

现在，当某些事件被触发时，我会在该表格上指定一个监听器，即

function livesearch(el, about, event) {
    if ( event.keyCode < 96 || event.keyCode > 105 ) {
        return;
    }

    var keyword = el.value;

    $(el).focusout(function() {
        $('#livesearch_results1').html('');
        $('#livesearch_results2').html('');
    });
...
}

它有效，但我想知道正确性。每次创建新表单时，这些侦听器是否都会被激活...它们是否相互覆盖（因为表单是由每个单元格的相同javascript生成的，因此id是相同的）

Answer 1

使用委托活动：$.on

示例：

$("body").on("focusout","yourelement",function(){
});

$("body").on("focusin","yourelement",function(){
});

在我发布的链接中的直接和委派活动部分下。你会看到：

事件处理程序仅绑定到当前选定的元素;他们   在您的代码调用.on（）时页面上必须存在。   要确保元素存在且可以选择，请执行事件   绑定在文档就绪处理程序中的元素   页面上的HTML标记。如果将新HTML注入页面，   选择元素并在新HTML之后附加事件处理程序   放入页面。或者，使用委派事件来附加事件   处理程序，如下所述。

委派事件的优势在于它们可以处理来自的事件   稍后添加到文档中的后代元素。通过   选择一个保证在当时存在的元素   委托事件处理程序附加，您可以使用委托事件   避免频繁附加和删除事件处理程序的需要。这个   element可以是a中视图的容器元素   例如，模型 - 视图 - 控制器设计，或者如果事件是文档   handler希望监视文档中的所有冒泡事件。该   文档元素在之前的文档头部中可用   加载任何其他HTML，因此可以安全地在那里附加事件   等待文件准备好。

除了能够处理后代元素的事件外   尚未创建，委托事件的另一个优势是他们的   当许多元素必须存在时，开销要低得多   监控。在此示例中，在其tbody中包含1,000行的数据表中   将处理程序附加到1,000个元素：

我想我不应该在这篇文章中再次解释这些好处。文档解释清楚。

用JQuery删除监听器？应该或不应该？

1 个答案: