js事件绑定bind和live

最新推荐文章于 2023-08-01 20:05:34 发布

weixin_34360651

最新推荐文章于 2023-08-01 20:05:34 发布

阅读量130

点赞数

文章标签： python javascript ViewUI

原文链接：https://my.oschina.net/zyxchuxin/blog/420784

版权

2019独角兽企业重金招聘Python工程师标准>>>

bind()：

bind()方法绑定元素的事件非常方便，绑定前，需要知道被绑定的元素名，绑定的事件名称，事件中执行的函数内容就可以了，绑定格式：

$(selector).bind(event,data,function)

参数event为事件名称，多个事件名称用空格隔开；function为事件执行的函数。

代码一：绑定单个事件

<input type="button" id="btn" value="点击绑定事件"/>
<script>
$(function(){
     $("#btn").bind("click",function(){
        alert("事件绑定成功！");
    });
});
</script>

代码二：绑定多个事件的写法①

<input type="button" id="btn" value="点击绑定事件"/>
<script>
$(function(){
     $("#btn").bind("click mouseout",function(){
        alert("事件绑定成功！");
    });
});
</script>

代码三：绑定多个事件的写法②

<input type="button" id="btn" value="点击绑定事件"/>
<script>
$(function(){
     $("#btn").bind({
     click:function(){
         alert("事件绑定成功---点击操作！");
     },
     dblclick:function(){
         alert("事件绑定成功---双击操作！");
     },
     mouseout:function(){
         alert("事件绑定成功---鼠标事件！");
     }
     });
});
</script>

live()：

与bind()方法相同，live()方法也可以绑定元素的可执行事件，除此相同功能之外，live()方法还可以绑定动态元素，即：使用代码添加的元素事件。格式如下：

$(selector).live(event,datafunction)

参数event为事件名称，data为触发事件时携带的数据，function为触发事件时执行的代码。

代码：给动态添加的元素绑定方法

$(function(){
     $("#btn").live("click",function(){
        alert("事件绑定成功！");
    });
    $("body").append("<input type='button' id='btn' value='事件绑定'/>");
});

注意：

从jQuery1.7开始，不在建议使用.live()方法；1.9不支持.live()。

转载于:https://my.oschina.net/zyxchuxin/blog/420784