jQuery用于点击功能的多个目标ID

Question

这可能有点多余，但我想知道是否有办法通过缩短代码以避免重复来改进代码。

$('a[href*="#about"]').click(function() 

我想定位#about #products #process #gallery #contact

我想避免：

$('a[href*="#about"]', 'a[href*="#process"]', a[href*="#etc"]' ).click(function() 

Answer 1

给他们所有的课程并定位：

$(".the-class").click(function() {
    // ...
});

如果你不能这样做，那么你想要避免（但做得正确）的是你需要做的事情：

$("[href=#about], [href=#products], [href=#process], [href=#gallery], [href=#contact]").click(function() {
    // ...
});

Answer 2

或者，您可以在页面上设置单击处理程序，并根据单击的元素进行委派。

var handledHrefs = ['#about', '#products', '#process', '#gallery', '#contact'];
$('body').on('click', 'a[href^=#]', function (e) {
  if (handledHrefs.includes(e.target.attr('href'))) {
    // ...
  }
});

这实际上比附加单个事件处理程序具有更好的性能，令人惊讶的是。