Question

我试图按按钮的顺序仅显示相应的元素，当我单击某个按钮时，它仅显示一个元素并隐藏其他元素，我要做的是，当我按时有3个元素当我按下第二个“ eq（1）”时，第一个“ eq（0）”显示第一个，但也显示最后一个，当我按下最后一个“ eq（2）”时，它显示第二个，但同时显示最后一个它显示了它应该显示的内容，它显示了自己（最后一个）！有什么问题吗？

$(".button").click(function(event) { 
     event.stopImmediatePropagation();
     var index = $(".button").index(this);
     $(".div-to-show").eq(index).css('display','block');
     $(".div-to-show").eq(!index).css('display','none');
 });

Answer 1

与jQuery的.eq()相反的是.not()。尝试这样的事情：

$(".button").click(function(event) { 
     event.stopImmediatePropagation();
     var index = $(".button").index(this);
     $(".div-to-show").eq(index).css('display','block');
     $(".div-to-show").not(`:eq(${index})`).css('display','none');
});

Answer 2

将let data = table.findAll(arg) .then((rdata) => { return rdata'; }); let data; table.findAll(arg) .then((rdata) => { data = rdata; });和.eq()与您创建的索引一起使用的示例。

.not()

$(function() {
  $(".button").click(function(event) {
    event.stopImmediatePropagation();
    var index = $(".button").index(this);
    console.log(index);
    $(".div-to-show").not(":eq(" + index + ")").hide();
    $(".div-to-show").eq(index).show();
  });
});

.div-to-show {
  padding: 10px;
  margin: 6px;
  border: 1px solid #ccc;
  border-radius: 6px;
}

.button {
  padding: 4px;
  margin: 3px;
  border: 1px solid #222;
  border-radius: 3px;
}

参考：

希望有帮助。

使用eq（）或index获得不同的结果

2 个答案: