为什么要绑定事件?

因为函数可以重复利用

例如：当页面有一个按钮，我们给它添加 onclick 事件时 如

btn.onclick=function (){

alert(‘A‘);

}

他会很好的弹出一个 A 出来，但是如果我们写两个呢？

btn.onclick=function (){

alert(‘A‘);

}

btn.onclick=function (){

alert(‘B‘);

}

那么它只会弹出一个 B，要想将 A 和 B 都弹出来调用多次 onclick事件就得用到事件绑定了。其它的事件使用也是如此。

时间： 2024-10-12 08:55:39

为什么要绑定事件?的相关文章

javascript绑定事件addEventListener与attachEvent

1.eleObj.addEventListener(eventName,handle,useCapture); eleObj:DOM元素: eventName:事件名称.注意,这里的事件名称没有“ on ”,如鼠标单击事件 click ,鼠标双击事件 doubleclick ,鼠标移入事件 mouseover,鼠标移出事件 mouseout 等. handle:事件句柄函数,即用来处理事件的函数: useCapture:Boolean类型,是否使用捕获,一般用false: 2.eleObj.at

06 同时给多个元素绑定事件

1 要求 同时给多个相同元素绑定相同的时间 例如:给一个无序列表中的每一个li元素绑定一个事件,单击每个li元素的时候改变背景颜色和文本颜色 2 思路 利用jQuery的on()实现同时绑定 3 准备 3.1 jQuery的 on()方法 怎么使用? 在选择元素上绑定一个或多个事件的事件处理函数. on()方法绑定事件处理程序到当前选定的jQuery对象中的元素.在jQuery 1.7中,.on()方法 提供绑定事件处理程序所需的所有功能.帮助从旧的jQuery事件方法转换,see .bind(

js绑定事件和解绑事件

在js中绑定多个事件用到的是两个方法:attachEvent和addEventListener,但是这两个方法又存在差异性 attachEvent方法  只支持IE678,不兼容其他浏览器 addEventListener方法   兼容火狐谷歌,不兼容IE8及以下 addEventListener方法 div.addEventListener('click',fn); div.addEventListener('click',fn2); function fn(){ console.log("春

关于怎样用PHP及JS来动态加载html元素及加载的html代码绑定事件失效的解决方法！

首先编写好的html代码放入php文件里面设置请求头格式为text/html 然后呢我将用jquery来操作 先定义一个用了盛放代码的容器 $(function(){}) => window.onload .sn-header-bg 是我用来盛放代码的容器 我的php文件名是header.php放在data目录下! 执行以上代码完成后一个页头就出来了! 加载完成后我在header里面绑定了两个函数,但是全部失效了,原因是没找到对应的dom元素, 根本原因是我没加载完成之前这两个函数就已经执行去寻

jquery使用on绑定事件的高级方法

$(doucment).on("click",".main",function(){ } //当页面中需要对发送ajax成功后生成的元素绑定事件时:就需要用到jquery的on方法来绑定事件:因为用这样的事件代理的方法:可以吧事件对象的事件代理到document上:这样就可以通过document来找到你要绑定的元素的对象上:

随笔一个dom节点绑定事件

以下利用jquery说明: js中,给一个dom节点绑定事件再平常不过了.这里说下,如果dom经常发生变化的话,给这个dom绑定事件的情况. 比如代码如下: li的节点,绑定了事件:点击会打出来里头的html内容. button点击事件:会生成一个li节点. 1 <html> 2 <head> 3 <meta charset="UTF-8"> 4 </head> 5 <body> 6 <ul class="ul

如何用js为动态生成的元素绑定事件

今天在开发项目的时候,需要为用js动态生成的元素绑定一个click事件,但是在页面加载之前,这个元素不存在,没法获取这个元素,然后为其添加事件.查阅jquery api 发现可以用on()事件(注意:新版本的jquery已经把live()去除,现在用on()),为动态生产的元素绑定事件,然后触发该事件执行.比如下面一个例子: 假设我们要给div动态添加的span绑定click事件形成如下结果 x //做法如下: ("#choose_result").on("click&quo

jQuery学习-事件之绑定事件（三）

在上一篇<jQuery学习-事件之绑定事件(二)>我们了解了jQuery的dispatch方法,今天我们来学习下handlers 方法: handlers: function( event, handlers ) {         var sel, handleObj, matches, i,             handlerQueue = [],             delegateCount = handlers.delegateCount,             cur =

javascript绑定事件

本质:不同的库或者工具中总是封装了不同的事件绑定形式,但是究其根源,还是IE事件模型和W3C事件模型不同的处理方式 1)W3C事件模型:支持事件捕捉和冒泡 addEventListener('type',function(){},bool) removeEventListener ('type',function(){},bool) 2)IE事件模型:仅支持事件冒泡 attachEvent('type',function(){}); detachEvent('type',fucntion(){}

绑定事件与解除绑定事件

事件绑定 定义:一个事件可以加多次,且不会覆盖: 绑定方法: 1,attachEvent ('on+事件名',函数名)  这个只兼容ie 6-8 2,addEventListener (事件名,函数名,false)  支持ie9+ chrom firfox; 绑定事件的封装 function addEvent(obj,sEv,fn){ if(obj.addEventListener){ obj.addEventListener(sEv,fn,false); }else{ obj.attachEv