CLASS my Body使用Jquery实现更大的CSS控件

Question

我试图给我的BODY提供与导航相同的类。问题是.match（/tab[0-9]/），因为类名是（一、二、三）。你能帮我把火柴换成别的吗？

html

<ul id="menu">
    <li><a href="#one" class="one">one</a></li>
    <li><a href="#two" class="two">two</a></li>
    <li><a href="#three" class="three">three</a></li>
</ul>

jquery

 $('#menu li a').click(function(){
     $("a").removeClass("active");
     $(this).addClass("active");
$('body').removeClass("one two three").addClass("" + $(".active").attr("class").match(/tab[0-9]/));
$("#bodyClass").text($('body').prop("class"));
});

$('body').removeClass("one two three").addClass("" + $(".active").attr("class").match(/tab[0-9]/));
$("#bodyClass").text($('body').prop("class"));

http://jsfiddle.net/J3qWx/10/

Answer 1

也像这样：

http://jsfiddle.net/J3qWx/12/

 $('#menu li a').click(function () {
     if ($(this).is('.active')) return;
     $('body').removeClass().addClass(this.className);
     $(this).closest('ul').find('.active').removeClass('active').end().addClass('active');
     $('#bodyClass').text($('body').attr('class'));
 });

Answer 2

（我可能误解了你的问题，我不确定你为什么要进行比赛？？）

试试这个：

$('#menu li a').click(function(){
     $("a").removeClass("active");
     $('body').removeClass("work myself fiddles").addClass($(this).prop('class'));
     $(this).addClass("active");
     $("#bodyClass").text($('body').prop("class"));
});

它只是从正文中删除类，然后将当前单击的类添加到正文

工作示例