• toggleClass() 隐藏层


    
    

    toggleClass(class|fn[,sw])

    toggleClass():如果存在(不存在)就删除(添加)一个类。
    <script src="../jquery-1.7.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function(){
            
            /*点击switcher元素里任何一个元素都会执行隐藏动作*/
            $("#switcher").click(function(){
                $("#switcher a").toggleClass("hidd");
            });
            
            
            
            /*只有点击switcher1的元素才会执行隐藏动作,点a不会产生折叠效果*/
            $("#switcher1").click(function(event){
                if(event.target == this){
                    $("#switcher1 a").toggleClass("hidd");
                }
            });
            
            var count=0;
            $("p").click(function(){
                $(this).toggleClass("highlight", ++count % 3== 0);
            });
        });
    </script>
    <style type="text/css">
        #switcher{width:300px; border:1px solid #000; background-color:#CCFFFF; padding:5px; cursor:pointer;}
        #switcher span{border:1px solid #FF0000; padding:5px; display:block; cursor:pointer;}
        #switcher span a{border:1px solid #0000FF; padding:5px; display:block; cursor:pointer;}
        #switcher span a.hidd{ display:none;}
        
        #switcher1{width:300px; border:1px solid #000; background-color:#CCFFFF; padding:5px; cursor:pointer; margin-top:10px;}
        #switcher1 span{border:1px solid #FF0000; padding:5px; display:block; cursor:pointer;}
        #switcher1 span a{border:1px solid #0000FF; padding:5px; display:block; cursor:pointer;}
        #switcher1 span a.hidd{ display:none;}
        
        .highlight{ color:red;}
    </style>
    <div id="switcher" style="">
        <span style=""><a style="">点我点我</a></span>
    </div>
        
    <div id="switcher1" style="">
        <span style=""><a style="">点我点我</a></span>
    </div>
    <p>点我哈哈</p>

  • 相关阅读:
    Js特效总结
    asp.net中的绝对路径和相对路径
    GrideView合并列合并序号,隐藏某列按钮
    WebConfig 配置文件详解
    ASP.NET打印EXCEl报表技术总结
    ADO.NET DataSet、DataTable、DataRow、DataView的学习
    asp.netGridView使用技巧
    .net Remoting
    C# webservice开发
    js实现网页打印分页打印
  • 原文地址:https://www.cnblogs.com/siyecao2010/p/3131603.html
Copyright © 2020-2023  润新知