具有多个类的 jQuery 元素 : storing one class as a var

Question

我正在尝试创建一个标准化的显示/隐藏元素系统，如下所示:

<div class="opener popup_1">Click Me</div>
<div class="popup popup_1">I'm usually hidden</div>

点击带有 opener 类的 div 应该 show() 带有弹出类的 div。我不知道在任何给定页面上将有多少个开启器/弹出窗口组合，我不知道开启器和弹出窗口将在任何给定页面上的何处显示，而且我不知道如何给定的开启程序应该调用 show() 来处理许多弹出窗口。开启器和弹出窗口都必须能够拥有比 jQuery 使用的更多的类。

我想做的是这样的:

$(".opener").click(function() {
  var openerTarget = $(this).attr("class").filter(function() {
    return this.class.match(/^popup_([a-zA-Z0-9-_\+]*) ?$/);
  });
  $(".popup." + openerTarget).show();

这个想法是，当您单击 opener 时，它会从 opener 的类中过滤掉“popup_whatever”并将其存储为 openerTarget。然后将显示任何带有 class=popup 和 openerTarget 的内容。

Answer 1

$('.opener').click(function() {
  var openerTarget = this.className.match(/\bpopup_\w+\b/);
  $('.popup.' + openerTarget).hide();
}​);​

http://jsbin.com/ezizu3/edit