jQuery中的事件理解

一:加载方式的三种写法。

1:$(document).ready(function(){

jquery代码

})

2:$(function(){

jquery代码

})

3:$().ready(function(){

jquery代码

})

二:绑定事件

bind(事件名字,function(){

绑定事件 内容

})

开 始很迷惑感觉这个是多此一举,比如说给一个输入框<input>绑定一个单击事件click,当单击这个<input>的时候就 触犯单击事件。 要实现这个效果完全不用bind事件,直接给这个<input>一个click事件就OK了 为什么还要绑定呢?这不是多此一举么?深入点想一下,发现原来是自己的理解太过于浅薄。比如说一个 按钮 submit.当你单击这个按钮之后就会触发一个click事件,之后提交表单的内容。我可以通过这个bind事件,给submit绑定一个focus事 件.这样一来当submit获得焦点的时候就提交表单的内容。

三:合成事件

1:hover(function1,function2);

当光标移动到元素上面时,会触发指定的第一个函数function1,当光标溢出这个元素时,会触发指定的第二个函数function2

2:toggle(fn1,fn2);

当鼠标第一次单击元素时,触发第一个函数fn1, 再次单击同一个元素时,触发第二个函数fn2,跟多的依次触发,重复调用

四:冒泡事件

嵌套元素里,同时绑定了同样的事件,当触发一个事件的时候,其他的事件也跟着被执行。例如:

<body> 上绑定这click事件 <form>也绑定这click事件 <input>同样绑定这click事件。拓扑结构如下 <body> -> <form> -> <input> 那么 我触发<input>的click事件的时候 <body><form>的click事件也跟着执行。。

解决冒泡事件

事件对象.stopPropagation()

阻止默认的行为

网页中的默认行为,单击超链接后会跳转,单击提交按钮后提交表单。有时候需要阻止元素的默认行为。

元素.preventDefaule();

也可以在事件处理函数中返回false return false

五:模拟操作

通过模拟的操作来达到用户的操作,trigger

$('#bin').trigger('click'); $('#bin').click

trigger

triggerHandler