jQuery事件对象 

<body>
<div style="width:600px; height:200px; background-color:red">
<input type="button" id="btn" value="button" />
<a href="http://www.baidu.com">百度</a>
</div>
</body>
</html>
<script>
$(function(){
    //获取事件的类型
    $('#btn').click(function(e){
        alert(e.type);
        })
    //获取触发元素的DOM
    $('#btn').click(function(e){
        alert(e.target);
        })
    //获取的是监听元素的DOM，你绑定的那个元素，就获取哪个元素
    $('#btn').click(function(e){
        alert(e.currentTarget);
        })
    //获取事件调用时的额外数据，可以使数字，字符串，数组，对象
    $('input').click(123,function(e){
        alert(e.data);
        })
    //pageX/pageY 获取相对页面原点的距离 screenX/screenY 获取显示屏位置的距离 clientX/clientY 获取相对于视点的距离
    $(document).click(function(e){
        alert(e.pageX+','+e.screenX+','+e.clientX);
        }) 
    //获取事件调用时的时间戳
    $('input').click(function(e){
        alert(e.timeStamp);
        })
    //获取鼠标或者键盘的按键
    $('input').bind('click',function(e){
        alert(e.which);
        })
    //获取事件触发时是否按下ctrl,alt,shift键
    $('input').bind('click',function(e){
        alert(e.ctrlKey);//shiftKey,altKey
        })
    //冒泡行为
    $('input').click(function(e){
        e.stopPropagation();//阻止冒泡行为
        alert('input');
        })
    $('div').click(function(e){
        alert('div');
        })
    $(document).click(function(e){
        alert('document');
        })
    //默认行为(如超链接跳转 、表单提交等)
    $('input').click(function(e){
        e.preventDefault();//阻止默认行为
        alert('失效');
        })
        
    
})
</script>

 

posted @ 2016-07-26 11:22  天照丶鼬  阅读(201)  评论(0)    收藏  举报