jquery DOM 事件冒泡 魔法图书馆

来源:互联网 发布:与明星合照软件 编辑:程序博客网 时间:2024/04/16 20:01


http://www.nowamagic.net/librarys/books/contents/jquery  链接地址

<div id="content">
    外层div元素
    <span>内层span元素</span>
    外层div元素
</div>
<a id="msg"></a>
</body>
<script type="text/javascript">
$(function(){
// 为span元素绑定click事件
$('span').bind("click",function(event){
var txt = $('#msg').html() + "<p>内层span元素被点击.<p/>";
$('#msg').html(txt);
event.stopPropagation();    //  阻止事件冒泡


});
// 为div元素绑定click事件
$('#content').bind('click',function(event){
var txt = $('#msg').html()+"<p> div元素被点击.</p>";
$('#msg').html(txt);
event.stopPropagation();
//event.preventDefault(); //阻止元素默认行为
});
// 为body元素绑定click事件
$("body").bind("click",function(){
var txt = $('#msg').html() + "<p>body元素被点击.<p/>";
$('#msg').html(txt);
});
})
</script>

bind() 是jquery 绑定对象/元素的函数,

事件对象

当你单击“element”元素时,事件对象就被创建了,这个事件对象只有事件处理函数能访问到,事件处理函数完毕后,事件对象就会被销毁。

event.stopPropagation();    //  阻止事件冒泡

//event.preventDefault(); //阻止元素的默认行为





原创粉丝点击