tab切换

html

<div class="tab_a">

                            <ul>
                                <li id="tab1" οnclick="showLatestOrHot(this)" class="on" value="1">学科配置</li>
                                <li id="tab2" οnclick="showLatestOrHot(this)" value="2">年级配置</li>

                            </ul>

js

function showLatestOrHot(t) {

    if (t.value == 1) {

        $("#gradeDiv").hide();
        $("#subjectDiv").show();
        $("#tab2").removeClass("on");
        $("#tab1").addClass("on");

    } else {
        $("#subjectDiv").hide();
        $("#gradeDiv").show();
        $("#tab1").removeClass("on");
        $("#tab2").addClass("on");

    }



}

html

 <ul class="menu" id="menutitle">
                    <li id="tab_1" class="aaa"><a href="javascript:void(0)" οnclick="delayChangeTab('1',0);"
                        οnmοuseοut="cancelChangeTab();">活动主页</a></li>
                    <li id="tab_2"><a href="javascript:void(0)" οnclick="delayChangeTab('2',0);" οnmοuseοut="cancelChangeTab();">
                        评课管理</a></li>
                </ul>

js

function tabs(n) {
    var len = 2;
    for (var i = 1; i <= len; i++) {
        document.getElementById("tab_a" + i).style.display = (i == n) ? "block" : "none";
        document.getElementById("tab_" + i).className = (i == n) ? "aaa" : "none";
    }
}