jquery文本框事件绑定与取消怎么实现?

发布时间:2019-11-10编辑:脚本学堂
本文介绍了jquery实现文本框事件绑定与取消的方法,bind是一次绑定事件到每一个子节点,on是只绑定到父节点,然后冒泡到各个子节点,需要的朋友参考下。

jquery的事件绑定已经用on替换了原来的bind;
区别:bind是一次绑定事件到每一个子节点;on是只绑定到父节点,然后冒泡到各个子节点;
用法:bind

一个事件,一个方法:

$(".class input").bind('click',function(e){...;e.stopPropagation;})
 

两个事件,一个方法:

$(".class input").bind('click mouseover',function(e){...;e.stopPropagation;})
 

两个事件,两个方法:

$(".class input").bind({ click:function(e){...;e.stopPropagation;}, mouseover:function(e){...;e.stopPropagation;} })
 

on,可以直接替换掉bind,就是说上述的用法都适用于on;
此外,on比bind多了两个可选参数

on( events [, selector ] [, data ], handler(eventObject) )
selector:要绑定的元素,上面的例子可以写成:

$(".class").bind('click','input',function(e){...;e.stopPropagation;})
 

(注意,有一个事件不好用,就是'大便'ie下独有的事件:onpropertychange;

可以用:

$(".class input").bind('propertychange',function(e){...;e.stopPropagation;})

没反应:

$(".class").bind('propertychange','input',function(e){...;e.stopPropagation;}) )

data:传递给event.data的参数,
 

$(".class").bind('click','input','123',function(e){alert(e.data/*123*/);e.stopPropagation;})
 

(更具体用法可查看手册http://api.jquery.com/on/);

2)、input textare 事件
之前做一个文本框内容实时变化事件触发时,用onkeyup + onchange;但onchang必须在文本框失焦后才会触发,后来发现可以用
(if IE) onpropertychange + else oninput 来处理。
说明:
oninput 事件在用户输入、退格、删除、剪切、粘贴及鼠标剪切与粘贴时触发(在 IE9&IE9+ 中可能略有区别)。
(Firefox、Chrome、IE9&IE9+ 均支持)
onpropertychange 事件在用户输入、退格、删除、剪切、粘贴及鼠标剪切与粘贴时触发
(仅 IE 支持)。

第二部分,jQuery 事件
jQuery 中事件方法的一些例子:
 

Event 函数 绑定函数至
$(document).ready(function) 将函数绑定到文档的就绪事件(当文档完成加载时)
$(selector).click(function) 触发或将函数绑定到被选元素的点击事件
$(selector).dblclick(function) 触发或将函数绑定到被选元素的双击事件
$(selector).focus(function) 触发或将函数绑定到被选元素的获得焦点事件
$(selector).mouseover(function) 触发或将函数绑定到被选元素的鼠标悬停事件

unbind() 方法移除被选元素的事件处理程序。
该方法能够移除所有的或被选的事件处理程序,或者当事件发生时终止指定函数的运行。
ubind() 适用于任何通过 jQuery 附加的事件处理程序。
取消绑定元素的事件处理程序和函数
规定从指定元素上删除的一个或多个事件处理程序。
如果没有规定参数,unbind() 方法会删除指定元素的所有事件处理程序。

第三部分,移除之前的绑定事件

用$("#result").unbind("click")
如果要移除所有的绑定事件,直接用 $("#result").unbind()

例题中用 $("#sidebar h3").unbind("click")

语法
$(selector).unbind(event,function)
使用 Event 对象来取消绑定事件处理程序
规定要删除的事件对象。用于对自身内部的事件取消绑定(比如当事件已被触发一定次数之后,删除事件处理程序)。
如果未规定参数,则 unbind() 方法会删除指定元素的所有事件处理程序。

语法

$(selector).unbind(eventObj)亲自试一试
参数 描述
eventObj 可选。规定要使用的事件对象。这个 eventObj 参数来自事件绑定函数。