码迷,mamicode.com
首页 > 其他好文 > 详细

四种绑定事件

时间:2017-07-01 17:24:30      阅读:182      评论:0      收藏:0      [点我收藏+]

标签:htm   事件   bind   http   asc   style   java   XML   ext   

<!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>

四种绑定事件

标签:htm   事件   bind   http   asc   style   java   XML   ext   

原文地址:http://www.cnblogs.com/Chenghao-He/p/7102580.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!