javascript - 将相同的处理程序应用于多个 jQuery 对象

Question

我知道我可以使用 $.each 将相同的事件处理程序应用于两个不同的 jQuery 对象。我很惊讶不可能有更清晰的语法，例如:

  var $span = $('span');
  var $div = $('div');

  var clickHandler = function () {
    $(this).toggleClass('red');
  }

  $($span, $div).on('click', clickHandler); // <-- Neater syntax
  $([$span, $div]).on('click', clickHandler); // <-- A little worse, but still better than $.each

为什么我尝试过的语法不起作用？有没有比使用 $.each 更简洁的替代方案？

Answer 1

$span.add($div).on('click', clickHandler)

应该按照 add() docs 做你想做的事.

1. $($span, $div) 被解释为 $span，它是 $div 的后代。
2. $([$span, $div]) 期望数组元素是 DOMElements，而不是 jQuery 对象(我一直希望这也是可能的)

您可以看到 jQuery documentation 中描述的这两种语法。