Question

first see this post 我有这个代码

$('.yesno').click(function(){
    $('.yesno').each(function(i, v){
        $(v).removeClass('selected');
    });
    $(this).addClass('selected');

     return false;
});

和html这个

    <a href="#">
    <span  class="Yes yesno">Yes</span>
</a>

<a href="#">
    <span class="No yesno">No</span>

当我进行多次投票时没有问题我得到了很大的问题

看到这个

<a href="#">
    <span  class="Yes yesno">Yes</span>
</a>

<a href="#">
    <span class="No yesno">No</span>
</a>
<a href="#">
    <span  class="Yes yesno">Yes</span>
</a>

<a href="#">
    <span class="No yesno">No</span>
</a>
</a>

点击第一个是，它会选中它，当我点击下一个是的时候点击它是因为selected但是第一个是unselected

我希望每个人都做一些瘦身，并且知道其他人是不同的

Answer 1

将你的html更改为此（添加链接组的div，可以是任何元素，或者你也可以在href上使用rel属性）。

<div class="linkgroup">  
  <a href="#">
      <span  class="Yes yesno">Yes</span>
  </a>

  <a href="#">
      <span class="No yesno">No</span>
  </a>
</div>

<div class="linkgroup">  
  <a href="#">
      <span  class="Yes yesno">Yes</span>
  </a>

  <a href="#">
      <span class="No yesno">No</span>
  </a>
</div>

然后JS就像：

$('.yesno').click(function(){
    $(this).parents('.linkgroup').find('.yesno').each(function(i, v){
        $(v).removeClass('selected');
    });
    $(this).addClass('selected');
    return false;
});

（还有一个jquery的兄弟选择器，可能会使代码更清晰，但不熟悉它。）

Answer 2

$('.yesno').click(function(){
    $(this).parents('.linkgroup').find('.yesno').each(function(i, v){
        $(v).toggleClass('selected');
    });
    $(this).toggleClass('selected');
    return false;
});

每个jquery的问题，并在两件事之间切换

2 个答案: