Question

在按钮1的单击事件中，如何仅从此部分中删除“已选择”类。不应删除按钮2的类，按钮2也是如此，如果单击按钮2，如果选择的类存在，则不应删除按钮1的类。我知道$('.small-button-1, .small-button-2').removeClass('selected');删除了所有内容。

<div class="block">
    <div id="abcd" class="lg_button">Button 1</div>
    <div>
        <div class="small-button-1 selected">1</div>
        <div class="small-button-2 selected">2</div>
    </div>
</div> 

<div class="block">
    <div id="dcba" class="lg_button">Button 2</div>
    <div>
        <div class="small-button-1 selected">1</div>
        <div class="small-button-2 selected">2</div>
    </div>
</div>

Answer 1

我已经这样做了但是必须重命名一些html标签才能让它在这里工作是我的榜样 http://jsfiddle.net/fKwGR/

jquery部分：

$(document).ready(function() {
$('div.lg_button1').click(function(){
        $('div.small-button-1.selected').attr('class','small-button-1');
        $('div.small-button-2.selected').attr('class','small-button-2');
        $('div.small-button-3').attr('class','small-button-3 selected');
        $('div.small-button-4').attr('class','small-button-4 selected');
        });
$('div.lg_button2').click(function(){
        $('div.small-button-1').attr('class','small-button-1 selected');
        $('div.small-button-2').attr('class','small-button-2 selected');
        $('div.small-button-3.selected').attr('class','small-button-3');
        $('div.small-button-4.selected').attr('class','small-button-4');
        });
});

HTML部分：

<div class="block">
  <div id="abcd" class="lg_button1">Button 1</div>
  <div id='button1'>
      <div class="small-button-1 selected">1</div>
      <div class="small-button-2 selected">2</div>
  </div>

<div class="block">
  <div id="dcba" class="lg_button2">Button 2</div>
  <div id='button2'>
      <div class="small-button-3 selected">1</div>
      <div class="small-button-4 selected">2</div>
  </div>

Answer 2

我相信您需要掌握父元素，然后将其用作选择器的上下文。像http://jsfiddle.net/VY5Md/之类的东西应该达到我想要的目标

  $(function(){
       $('.lg_button').click(function(){
           var $p = $(this).parents('.block');
           $('.selected', $p).removeClass('selected'); 
       }); 
  });

此代码获取单击的按钮，找到具有类＆＃34;阻止＆＃34;的父级。然后删除班级＆＃34;选择＆＃34;从任何与班级＃34;选择＆＃34;在＆＃34;块＆＃34;

的上下文中

从html元素中删除类

2 个答案: