zoukankan      html  css  js  c++  java
  • 左侧菜单

    代码示例:

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
    .hide{
    display: none;
    }
    </style>
    </head>
    <body>
    <div>
    <div class="menu">菜单一</div>
    <div class="con hide">
    <p>11111</p>
    <p>22222</p>
    <p>33333</p>
    <p>44444</p>
    </div>
    </div>

    <div>
    <div class="menu">菜单二</div>
    <div class="con hide">
    <p>11111</p>
    <p>22222</p>
    <p>33333</p>
    <p>44444</p>
    </div>
    </div>

    <div>
    <div class="menu">菜单三</div>
    <div class="con hide">
    <p>11111</p>
    <p>22222</p>
    <p>33333</p>
    <p>44444</p>
    </div>
    </div>
    <script src="jquery-3.2.1.js"></script>
    <script>
    $(function () {
    bindclick();
    });
    function bindclick() {
    $('.menu').click(function () {
    $(this).next().removeClass('hide').parent().siblings().children('.con').addClass('hide')
    })
    }
    </script>
    </body>
    </html>



    function bindclick1() {
            $('.menu').click(function () {
    
                if($(this).next().hasClass('hide')){
                     $(this).next().removeClass('hide').parent().siblings().children('.left-item1').addClass('hide')
                }else{
                     $(this).next().addClass('hide').parent().siblings().children('.left-item1').addClass('hide')
                }
    
    
            })
        }
    左侧菜单新功能
    Java学习内容
  • 相关阅读:
    Spring自动代理机制
    JUnit4 详解
    struts2 OGNL
    loj4j的配置跟使用
    junit浅学笔记二
    shell变量设置
    zookeeper使用
    [zz]Linux kernel map
    glog 使用中存在的问题
    shell中特殊字符(串)
  • 原文地址:https://www.cnblogs.com/wangtc/p/10576269.html
Copyright © 2011-2022 走看看