四种绑定事件

最新推荐文章于 2024-07-11 20:55:36 发布

aaulbyf330132

最新推荐文章于 2024-07-11 20:55:36 发布

阅读量55

点赞数

文章标签： xhtml javascript ViewUI

原文链接：http://www.cnblogs.com/Chenghao-He/p/7102580.html

版权

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>New Web Project</title>
    <style type="text/css">
        li{
            float:left;
            margin-left:50px;
            list-style:none;
        }
    </style>
    <script src="js/jQuery1.11.1.js"></script>
    <script src="js/jquery-migrate-1.2.0.js"></script>

    <script type="text/javascript">
        $(function () {
            //dom 2 级注册 bind()

            //live
            $("li").live({
                mouseover:function(){
                    $(this).css("background","pink");
                },
                mouseout:function(){
                    $(this).css("background","");
                }
            });

            $("li").die("mouseout");


//on　　　　　　　　推荐使用
            /*     $("li").on({　　　　　　　　　　//选择元素
             mouseover:function(){　　　　　　　　　//将li和mouseover事件绑定
             $(this).css("background","pink");
             },
             mouseout:function(){　　　　　　　　　　//复合绑定mouseout
             $(this).css("background","");
             }
             });


             $("li").off("mouseout");　　　　　　//off()用来解除mouseout事件绑定
             */





            //delegate
            /*     $("ul").delegate("li",{
             mouseover:function(){
             $(this).css("background","pink");
             },
             mouseout:function(){
             $(this).css("background","");
             }
             });

             $("ul").undelegate("mouseout"); */




            /*     $("li").bind({
             mouseover:function(){
             $(this).css("background","pink");
             },
             mouseout:function(){
             $(this).css("background","");
             }
             });

             //卸载事件  
             $("li").unbind("mouseout mouseover"); */
        });

    </script>
</head>
<body>
<ul>
    <li>首页</li>
    <li>公司信息</li>
    <li>人才计划</li>
</ul>
</body>
</html>

转载于:https://www.cnblogs.com/Chenghao-He/p/7102580.html

aaulbyf330132

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
四种绑定事件

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv...
复制链接

扫一扫