首页 > 代码库 > python : jquery实现左侧菜单

python : jquery实现左侧菜单

2024-08-24 14:29:08   219人阅读

左侧菜单

技术分享 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>Title</title>
    <style>
          .header{
            background-color: black;
            color: wheat;
        }
        .content{
            min-height: 50px;
        }
        .hide{
            display: none;
        }
    </style>
</head>
<body>
<div style="height:400px;width: 200px;border: 1px solid #dddddd">
        <div class="item">
            <div class="header">标题一</div>
            <div id="i1" class="content hide">内容</div>
        </div>
        <div class="item">
            <div class="header">标题二</div>
            <div class="content hide">内容</div>
        </div>

        <div class="item">
            <div class="header">标题三</div>
            <div class="content hide">内容</div>
        </div>
    </div>
<script src="jquery-1.12.4.js"></script>
<script>
    $(".header").click(function () {
        $(this).next().removeClass(‘hide‘).parent().siblings().find(".content").addClass("hide")
//next获取下一个标签
    })
</script>

</body>
</html>
左侧菜单

 

python : jquery实现左侧菜单


联系
我们