首页 > 代码库 > jQuery中的事件

jQuery中的事件

2024-10-14 17:15:39   216人阅读

1：加载dom
    在页面加载完毕后, 浏览器会通过 JavaScript 为 DOM 元素添加事件. 在常规的 JavaScript 代码中,
    通常使用 window.onload 方法, 在 jQuery 中使用$(document).ready() 方法.
    $(document).ready(function(){});缩写$(function(){});
2: 事件绑定：对匹配的元素进行特定的事件绑定: bind()
3：合成事件：
        hover(): 模拟光标悬停事件. 当光标移动到元素上时, 会触发指定的第一个函数, 当光标移出这个元素时, 会触发指定的第二个函数.
        toggle(): 用于模拟鼠标连续单击事件. 第一次单击元素, 触发指定的第一个函数, 当再一次单击同一个元素时, 则触发指定的第二个函数, 如果有更多个函数, 则依次触发, 直到最后一个.
        toggle() 的另一个作用: 切换元素的可见状态.
4:事件冒泡
    事件会按照 DOM 层次结构像水泡一样不断向上只止顶端
    解决: 在事件处理函数中返回 false, 会对事件停止冒泡. 还可以停止元素的默认行为.
5：事件对象的属性
    事件对象: 当触发事件时, 事件对象就被创建了. 在程序中使用事件只需要为函数添加一个参数. 该事件对象只有事件处理函数才能访问到. 事件处理函数执行完毕后, 事件对象就被销毁了.
    event.pageX, event.pageY: 获取到光标相对于页面的 x, y 坐标.
    //事件：例如鼠标移动  触发mousemove事件
    //如何得到事件对象：在响应函数中添加一个参数就可以，参数名无所谓，event
    //事件对象的两个属性：
    $(function()
    {
        $("body").mousemove(function(event)
        {
            $("#msg").text("x:"+event.pageX+" y:"+event.pageY);
        });
    });
6：移除事件
    移除某按钮上的所有  click 事件: $(“btn”).unbind(“click”)
    移除某按钮上的所有事件: $(“btn”).unbind();
    one(): 该方法可以为元素绑定处理函数. 当处理函数触发一次后, 立即被删除. 即在每个对象上, 事件处理函数只会被执行一次.
        $("li").click(function()
                    {
                        alert(this.firstChild.nodeValue);
                        if("bj"==this.id)
                        {
                            $("#bj").unbind("click");
                        }
                    });
         
        //one();只为某一个元素添加一次事件，事件响应后不在被触发
            $("#rl").one("click",function()
                    {
                        alert("test");
                    });
 

jQuery中的事件


联系
我们