Javascript 按钮链删除以前的类

我正在编写一个代码来更改身体背景img。它与我点击按钮并更改img的按钮一起工作。当我点击第一个按钮时，它工作了，然后我点击第二个按钮，它也工作了…但当我再次点击第一个按钮时，它不工作了

我尝试了一些代码来删除上一个类，但它不起作用。我真的不太了解代码：'(

谢谢。这是代码：

<script type="text/javascript">
        $(document).ready(function(){  

        $('.button1').click(function(){
            $('body').addClass('fondonieve1').siblings().removeClass('active'); 
         });
          $('.button2').click(function(){
            $('body').addClass('fondonieve2').siblings().removeClass('active');
          });
          $('.button3').click(function(){
             $('body').addClass('fondootono1').siblings().removeClass('active');

        });
       });
</script>

$（文档）.ready（函数（）{
$（'.button1'）。单击（函数（）{
$（'body'）.addClass（'fondonieve1'）.sides（）.removeClass（'active'）；
});
$（'.button2'）。单击（函数（）{
$（'body'）.addClass（'fondonieve2'）.sides（）.removeClass（'active'）；
});
$（'.button3'）。单击（函数（）{
$（'body'）.addClass（'fondootono1'）.sides（）.removeClass（'active'）；
});
});

您可以像这样再次删除类

$('body').addClass('fondonieve1').siblings().removeClass('active').removeClass('fondonieve2');

<script type="text/javascript">
        $(document).ready(function(){  

        $('.button1').click(function(){
            $('body').addClass('fondonieve1').siblings().removeClass('active').removeClass('fondonieve2');
         });
          $('.button2').click(function(){
            $('body').addClass('fondonieve2').siblings().removeClass('active').removeClass('fondonieve1');
          });
          $('.button3').click(function(){
             $('body').addClass('fondootono1').siblings().removeClass('active').removeClass('fondonieve2');

        });
       });
</script> 

所以你的代码应该是这样的

$('body').addClass('fondonieve1').siblings().removeClass('active').removeClass('fondonieve2');

<script type="text/javascript">
        $(document).ready(function(){  

        $('.button1').click(function(){
            $('body').addClass('fondonieve1').siblings().removeClass('active').removeClass('fondonieve2');
         });
          $('.button2').click(function(){
            $('body').addClass('fondonieve2').siblings().removeClass('active').removeClass('fondonieve1');
          });
          $('.button3').click(function(){
             $('body').addClass('fondootono1').siblings().removeClass('active').removeClass('fondonieve2');

        });
       });
</script> 

$（文档）.ready（函数（）{
$（'.button1'）。单击（函数（）{
$（'body'）.addClass（'fondonieve1'）.sides（）.removeClass（'active'）.removeClass（'fondonieve2'）；
});
$（'.button2'）。单击（函数（）{
$（'body'）.addClass（'fondonieve2'）.sides（）.removeClass（'active'）.removeClass（'fondonieve1'）；
});
$（'.button3'）。单击（函数（）{
$（'body'）.addClass（'fondootono1'）.sides（）.removeClass（'active'）.removeClass（'Fondoneve2'）；
});
});

完整的代码

CSS

剧本

<script src="http://www.google.com/jsapi?key=ABQIAAAABZGjjDpjmjbzLaNWBpdrWhRYfwzT-VuwidSQZM_JU-MUSrbEShR1efDdxuqpWPsjsfs1V_59FUTrxg" type="text/javascript"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script type="text/javascript">
            $(document).ready(function(){  

            $('.button1').click(function(){
                $('body').addClass('fondonieve1').removeClass('fondonieve2 fondootono1 fondootono2 fondoplanoclaro fondoplanooscuro'); 
             });
          $('.button2').click(function(){
                $('body').addClass('fondonieve2').removeClass('fondonieve1 fondootono1 fondootono2 fondoplanoclaro fondoplanooscuro'); 
             });
          $('.button3').click(function(){
                $('body').addClass('fondootono1').removeClass('fondonieve2 fondonieve1 fondootono2 fondoplanoclaro fondoplanooscuro'); 
             });
          $('.button4').click(function(){
                $('body').addClass('fondootono2').removeClass('fondonieve2 fondootono1 fondonieve1 fondoplanoclaro fondoplanooscuro'); 
             });
          $('.button5').click(function(){
                $('body').addClass('fondoplanoclaro').removeClass('fondonieve2 fondootono1 fondootono2 fondonieve1 fondoplanooscuro'); 
             });
          $('.button6').click(function(){
                $('body').addClass('fondoplanooscuro').removeClass('fondonieve2 fondootono1 fondootono2 fondoplanoclaro fondonieve1'); 
             });

            });
    </script>

$（文档）.ready（函数（）{
$（'.button1'）。单击（函数（）{
$（'body'）.addClass（'fondonieve1'）.removeClass（'fondonieve2 fondootono1 fondootono2 fondoplanoclaro fondoplanooscuro'）；
});
$（'.button2'）。单击（函数（）{
$（'body'）.addClass（'fondonieve2'）.removeClass（'fondonieve1 fondootono 1 fondootono 2 fondoplanoclaro fondoplanooscuro'）；
});
$（'.button3'）。单击（函数（）{
$（'body'）.addClass（'fondootono1'）.removeClass（'fondoneve2 fondoneve1 fondootono2 fondoplanoclaro fondoplanooscuro'）；
});
$（'.button4'）。单击（函数（）{
$（'body'）.addClass（'fondootono2'）.removeClass（'Fondoneve2 fondootono1 Fondoneve1 fondoplanoclaro fondoplanooscuro'）；
});
$（'.button5'）。单击（函数（）{
$（'body'）.addClass（'fondoplanoclaro'）.removeClass（'Fondoneve2 fondootono1 fondootono2 Fondoneve1 fondoplanooscuro'）；
});
$（'.button6'）。单击（函数（）{
$（'body'）.addClass（'fondoplanooscuro'）.removeClass（'fondonieve2 fondootone1 fondootone2 fondoplanoclaro fondonieve1'）；
});
});

HTML

Nieve1
尼维2
Otoño1
奥托尼亚
克拉罗
奥斯库罗

您还需要使用removeClass，以摆脱以前单击按钮添加的类。