Question

我知道如果我需要多次引用这个元素，那么将HTML元素引用到变量中是一个很好的做法。但是在制作我的项目时我遇到了这个问题。如何将多个相同的事件绑定到存储在变量中的元素？

现在我这样处理：

var producerEl = $("#js-producer");
var brandEl = $("#js-brand");
var seriesEl = $("#js-series");

bind(seriesEl);
bind(brandEl);
bind(seriesEl);

function bind($el) {
    $el.on("keypress", function () {
       // some code..
    });
}

我需要像$（producerEl，brandEl，seriesEl）.on ...

这样的东西

Answer 1

var producerEl = $("#js-producer");
var brandEl = $("#js-brand");
var seriesEl = $("#js-series");

  producerEl.add(brandEl).add(seriesEl).on("click", function () {
        alert('hello');
    });

Answer 2

如果您试图保持代码可读，我可以建议这种方法吗？

$("#js-producer, #js-brand, #js-series").on('keypress', function () { });

Answer 3

嗯。如果你只使用这些选择器，不要关心“我知道它是好的”。最好的解决方案是David Smith提供的解决方案。

无论如何，jQuery正在使用sizzle选择器引擎，它拥有自己的缓存。你可以要求 $（“＃js-producer，＃js-brand，＃js-series”）

结果将被缓存并重复使用。

将多个事件绑定到存储在变量中的元素

3 个答案: