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

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”）

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