Question

我有一个包含多个div的页面，每个div都有一个按钮，通过在点击时添加不同的类来隐藏或显示该div中的某些内容。我目前已经开始工作，但是我使用多个if语句检查点击了哪个按钮。我目前的代码如下：

$(".classofallbuttons").click(function () {
id = this.id;
if (id === 'btnid5'){
     $("#divtoggle5").toggleClass("firstclass");
     $("#divtoggle5").toggleClass("secondclass");
}
if (id === 'btnid6'){
     $("#divtoggle6").toggleClass("firstclass");
     $("#divtoggle6").toggleClass("secondclass");
}

虽然它有效但有10个或更多的div，看起来我应该能够做一些更简化的事情，因为除了按钮和div的ID之外，一切都是相同的。但我是新手，所以我不确定最好的方法是什么？

Answer 1

toggleClass()方法接受多个要切换的类。

你可以这样做：

$(".classofallbuttons").click(function() {
  var n = this.id.split("btnid")[1];
  $("#divtoggle" + n).toggleClass("firstclass secondclass");
});

Answer 2

您可以从当前按钮ID中提取索引。

$('.classofallbuttons').click(function(){
    var id = +/(\d+)/.exec(this.id)[1];
    $('#divtoggle' + id).toggleClass('firstclass secondclass')
});

jquery清理我的多个ifs

2 个答案: