Jquery 如何将类添加到单击的类之前的元素？

我有下面的HTML，我正在其中建立基于星星的投票。我想知道，如果用户点击第四颗星，那么所有的星星，包括他们点击的星星，都会有一个新的类，它会显示星星点亮，这样他们就会有一个叫做jquery ratings full的CSS类

---

您可以选择具有的上一个同级，也可以选择具有的下一个同级：

---

您可以选择具有的上一个同级，也可以选择具有的下一个同级：

.prevAll-选择以前的所有同级 .addBack-将this元素添加到选择中，这样您也可以填充单击的星号

您可以先删除所有星星的填充，但如果用户无法再次更改其投票率，则无需执行此操作

$('.jquery-ratings-star').click(function(){
   $('.jquery-ratings-star').removeClass('jquery-ratings-full');
   $(this).prevAll().addBack().addClass('jquery-ratings-full');     
});

工作演示：

.prevAll-选择以前的所有同级 .addBack-将this元素添加到选择中，这样您也可以填充单击的星号

您可以先删除所有星星的填充，但如果用户无法再次更改其投票率，则无需执行此操作

$('.jquery-ratings-star').click(function(){
   $('.jquery-ratings-star').removeClass('jquery-ratings-full');
   $(this).prevAll().addBack().addClass('jquery-ratings-full');     
});

---

工作演示：

我没有仔细检查过，但类似的东西应该可以做到这一点

var stars = $(#starRating).children('img');

stars.click(function(e){
  var clickedIndex = $(e.target).index();

  // If you want user to be able to click a different star,
  // after they've already clicked one, do this first

  stars.removeClass('selected')    

  // Apply selected class to every star at or below the clicked index

  stars.each(function(){
    if ($(this).index() <= clickedIndex){
      $(this).addClass('selected');
    }
  });

  // Set a callback function to track or process rankings, if needed

  optionalCallback(clickedIndex);
});

---

我还没有仔细检查过，但像这样的东西应该能奏效

var stars = $(#starRating).children('img');

stars.click(function(e){
  var clickedIndex = $(e.target).index();

  // If you want user to be able to click a different star,
  // after they've already clicked one, do this first

  stars.removeClass('selected')    

  // Apply selected class to every star at or below the clicked index

  stars.each(function(){
    if ($(this).index() <= clickedIndex){
      $(this).addClass('selected');
    }
  });

  // Set a callback function to track or process rankings, if needed

  optionalCallback(clickedIndex);
});

---

查看jQueryOr中的.prev或.prevAll使用纯CSS：查看jQueryOr中的.prev或.prevAll使用纯CSS：如果您删除所有元素的类，例如$this.sides.addBack.removeCLass'…'，不是更好吗？结束，然后将类添加到前面的元素中：@泰瑞：在什么方面更好？做一件事有很多方法；如果您删除所有元素的类，例如$this.sibles.addBack.removeCLass“…”，然后将类添加到前面的元素中，不是更好吗@泰瑞：在什么方面更好？做一件事有很多方法；真正地我真的很喜欢所有大写的代码注释。。因为我的代码从不使用大写字母，所以它可以帮助我的眼睛看到注释，即使它们深藏在代码中。。。我不知道这是失礼…：\仅供参考，stars已经是jQuery对象，所以您可以用stars替换$stars。再次将其传递给jQuery没有意义，或者您会执行$$'foo'吗？外部。每个循环都是完全不必要的，只需执行星号。单击。。。。内部。每个循环可以简化为stars.slice0，单击索引+1。添加类“选定”；。我的评论在痛苦中尖叫，因为我写得太辛苦了！！好吧，我让步。评论和反对票迫使我更新我的答案。希望现在大家都不那么失望……真的吗？我真的很喜欢所有大写的代码注释。。因为我的代码从不使用大写字母，所以它可以帮助我的眼睛看到注释，即使它们深藏在代码中。。。我不知道这是失礼…：\仅供参考，stars已经是jQuery对象，所以您可以用stars替换$stars。再次将其传递给jQuery没有意义，或者您会执行$$'foo'吗？外部。每个循环都是完全不必要的，只需执行星号。单击。。。。内部。每个循环可以简化为stars.slice0，单击索引+1。添加类“选定”；。我的评论在痛苦中尖叫，因为我写得太辛苦了！！好吧，我让步。评论和反对票迫使我更新我的答案。希望现在大家都不那么失望。。。