javascript - 如何制作动态名称选择器(无限)

Question

我不熟悉 jQuery，并且我有多余的 jQuery 调用，我想将它们放入循环中。

$('.class1').on('click', function () { ...
$('.class2').on('click', function () { ...
$('.class3').on('click', function () { ...
$('.class4').on('click', function () { ...
$('.class5').on('click', function () { ...
...

这是完整的调用之一:

$('.class1').on('click', function () { 
     if ($('.anotherclass1').is(':visible')) { 
         $(this).text("Show"); $('.anotherclass1').hide(); 
     } else { 
         $(this).text("Hide"); $('.anotherclass1').show(); 
     } 
});

有没有办法在不重复的情况下做到这一点？

这是我的JsFiddle

Answer 1

如果您确定这些元素只有一个类名，您可以在属性上使用开头运算符。我不想在实践中使用它，因为有很多更好的解决方案。

$('[class^=class]').on('click' ...

更好的解决方案需要查看实际的 HTML 结构。

由于一些傻瓜**们:-)提示这个答案的完整性，你的完整代码现在看起来像这样:

$('[class^=class]').on('click', function() {
    $('.another' + this.className).toggle();
});

演示:http://jsfiddle.net/9vj3wagt/2/