JQuery事件的链式写法 

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>JQuery事件的链式写法</title>
    <link type="text/css" rel="stylesheet" href="../../CSS/1-2.css" /> <!-- 使用link引用CSS -->
    <script type="text/javascript" src="../../JQuery/jquery-2.1.4.min.js">
    </script>
    <script type="text/javascript">
        $(function () {
            $(".divTitle").click(function () {
                $(this).addClass("divCurrColor")
                 .next(".divContent").toggle();
                   // .next(".divContent").css("display", "block");
               // $(divContent2).toggle();
            });
        });
        //$(function () {
        //    $(".divContent").click(function () {
        //        $(this).css("display", "none");
        //    })
        //})
        $(function () {
            $(".divContent").click(function () {
                $(this).toggle();
            })
        })
    </script>
</head>
<body>
    <div class="divFrame">
        <div class="divTitle">主题</div>
        <div class="divContent">
            <a href="#">链接一</a><br />
            <a href="#">链接二</a><br />
            <a href="#">链接三</a>
        </div>
        <div class="divContent2">
            <a href="#">链接一</a><br />
            <a href="#">链接二</a><br />
            <a href="#">链接三</a>
        </div>
    </div>
</body>
</html>

 

posted @ 2015-07-28 09:19  赵孟蒙  Views(283)  Comments(0)  Edit  收藏  举报