jquery 选择器 a 更多 简化

来源:互联网 发布:产品设计软件 axure 编辑:程序博客网 时间:2024/05/16 11:00
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>挑战题</title>
        <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
    </head>
    
    <body>
        <ul>
            <li>ffff</li>
            <li>ddd</li>
            <li style="display:none">rrrr</li>
            <li style="display:none">wwww</li>
            <a id="moreInfo" href="javascript:;" onclick="showMore(this.id)">更多</a>
        </ul>
        <script>

            function showMore(btnid){

               //ID选择器需要加“#”

                if($("#moreInfo").html()=="更多"){
                    $("li:hidden").show();
                    $("#moreInfo").html("简化");
                }else{
                    $("li:eq(2)").css("display","none");
                    $("li:eq(3)").css("display","none");
                    $("#moreInfo").html("更多");
                }
            } 
        </script>
    </body>

</html>



0 0
原创粉丝点击