zoukankan      html  css  js  c++  java
  • 通过判断自定义属性的值给出不同的样式

    点击更多, 展开缩小 brand        
    <div class="brand clearfloat">
                <dl class="clearfloat">
                    <dt class="fl"> <a href="javascript:;">品牌:</a></dt>
                    <dd class="clearfloat">
                        <a href="javascript:;">全部</a>
                        <a href="javascript:;">A3复印纸</a>
                        <a href="javascript:;"  class="select">A3复印纸</a>
                        <a href="javascript:;">A3复印纸</a>
                        <a href="javascript:;">A3复印纸</a>
                        <a href="javascript:;">全部</a>
                        <a href="javascript:;">A3复印纸</a>
                        <a href="javascript:;"  class="select">A3复印纸</a>
                        <a href="javascript:;">A3复印纸</a>
                        <a href="javascript:;">A3复印纸</a>
                        <a href="javascript:;">全部</a>
                        <a href="javascript:;">A3复印纸</a>
                        <a href="javascript:;"  class="select">A3复印纸</a>
                        <a href="javascript:;">A3复印纸</a>
                        <a href="javascript:;">A3复印纸</a>
                        <a href="javascript:;">全部</a>
                        <a href="javascript:;">A3复印纸</a>
                        <a href="javascript:;"  class="select">A3复印纸</a>
                        <a href="javascript:;">A3复印纸</a>
                        <a href="javascript:;">A3复印纸</a>
                    </dd>
                </dl>
                <div class="more" data-state="0">
                    更多
                </div>
            </div>
    
    
    //
        $(".more").click(function () {
            if ( $(this).attr("data-state") == 0) {  //判断自定义属性的值
                $(this).parent().css({ "height": "auto" });
                $(this).attr("data-state","1")    //修改
            } else if ($(this).attr("data-state") == 1) {
                $(this).parent().css({ "height": "45px" });
                $(this).attr("data-state", "0")
            }
           
        })
    

    data-XXXX  直接在HTML标签中加入这个属性然后给值,
    通过JQ的atrt去判断
    
    
  • 相关阅读:
    继承
    对象和封装
    类的无参、带参方法
    类和对象
    数组
    循环结构
    选择结构
    变量、数据类型和运算符
    快捷键
    MyEclipse与JDK的配置
  • 原文地址:https://www.cnblogs.com/C-dashazi/p/6906687.html
Copyright © 2011-2022 走看看