jQuery 学习十二(事件)

[b][color=#345286] ● ready(fn)[/color][/b]

/**
* 当 DOM 载入就绪可以查询及操纵时绑定一个要执行的函数。
*
* 这是事件模块中最重要的一个函数,因为它可以极大地提高 web 应用程序的响应速度。
*
* 简单地说,这个方法纯粹是对向 window.load 事件注册事件的替代方法。通过使用这个方法,可以在 DOM
* 载入就绪能够读取并操纵时立即调用你所绑定的函数,而 99.99% 的 JavaScript 函数都需要在那一刻执行。
*
* 有一个参数对 jQuery 函数的引用会传递到这个 ready 事件处理函数中。可以给这个参数任意起一个名字,
* 并因此可以不再担心命名冲突而放心地使用 $ 别名。
*
* 请确保在 <body> 元素的 onload 事件中没有注册函数,否则不会触发 $(document).ready() 事件。
*
* 可以在同一个页面中无限次地使用 $(document).ready() 事件。其中注册的函数会按照(代码中的)先后顺序
* 依次执行。
*
* @fn(Function) 要在 DOM 就绪时执行的函数
* @return jQuery Object
* @owner jQuery Object
*/
function ready(fn);

// 例子一:在 DOM 加载完成时运行的代码,可以这样写:
$(document).ready(function() {
// 在这里写你的代码 ...
});

// 例子二:使用 $(document).ready() 的简写,同时内部的 jQuery 代码依然使用 $ 作为别名,而不管
全局的 $ 为何。
jQuery(function($) {
// 你可以在这里继续使用 $ 作为别名 ...
});


[b][color=#345286] ● bind(type, [data], fn)[/color][/b]

/**
* 为每一个匹配元素的特定事件(像 click)绑定一个事件处理器函数。
*
* 这个事件处理函数会接收到一个事件对象,可以通过它来阻止(浏览器)默认的行为。如果既想取消默认的行为,
* 又想阻止事件起泡,这个事件处理函数必须返回 false。多数情况下,可以把事件处理器函数定义为匿名函数
* (见示例一)。在不可能定义匿名函数的情况下,可以传递一个可选的数据对象作为第二个参数(而事件处理器
* 函数则作为第三个参数),见示例二。
*
* @type(String) 事件类型
* @data(Object) (可选) 作为 event.data 属性值传递给事件对象的额外数据对象
* @fn(Function) 绑定到每个匹配元素的事件上面的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function bind(type, [data], fn);

// 例子一:当每个段落被点击的时候,弹出其文本。
$("p").bind("click", function() {
alert( $(this).text() );
});

// 例子二:你可以在事件处理之前传递一些附加的数据。
function handler(event) {
alert(event.data.foo);
}
$("p").bind("click", {foo: "bar"}, handler);

// 例子三:通过返回 false 来取消默认的行为并阻止事件起泡。
$("form").bind("submit", function() { return false; });

// 例子四:通过使用 preventDefault() 方法只取消默认的行为。
$("form").bind("submit", function(event) {
event.preventDefault();
});

// 例子五:通过使用 stopPropagation() 方法只阻止一个事件起泡。
$("form").bind("submit", function(event) {
event.stopPropagation();
});


[b][color=#345286] ● one(type, [data], fn)[/color][/b]

/**
* 为每一个匹配元素的特定事件(像 click)绑定一个一次性的事件处理函数。
*
* 在每个对象上,这个事件处理函数只会被执行一次。其他规则与 bind() 函数相同。这个事件处理函数会接收
* 到一个事件对象,可以通过它来阻止(浏览器)默认的行为。如果既想取消默认的行为,又想阻止事件起泡,
* 这个事件处理函数必须返回 false。
*
* 多数情况下,可以把事件处理函数定义为匿名函数(见示 bind() 示例一)。在不可能定义匿名函数的情况下,可以传递一
* 个可选的数据对象作为第二个参数(而事件处理函数则作为第三个参数),见 bind() 示例二。
*
* @type(String) 事件类型
* @data(Object) (可选) 作为 event.data 属性值传递给事件对象的额外数据对象
* @fn(Function) 绑定到每个匹配元素的事件上面的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function one(type, [data], fn);

// 例子:当所有段落被第一次点击的时候,显示所有其文本。
$("p").one("click", function() {
alert( $(this).text() );
});


[b][color=#345286] ● trigger(type, [data])[/color][/b]

/**
* 在每一个匹配的元素上触发某类事件。
*
* 这个函数也会导致浏览器同名的默认行为的执行。比如,如果用 trigger() 触发一个 "submit",则同样会
* 导致浏览器提交表单。如果要阻止这种默认行为,应返回 false。
*
* 你也可以触发由 bind() 注册的自定义事件。
*
* @type(String) 要触发的事件类型
* @data(Array) (可选) 传递给事件处理函数的附加参数
* @return jQuery Object
* @owner jQuery Object
*/
function trigger(type, [data]);

// 例子一:提交第一个表单,但不用 submit()。
$("form:first").trigger("submit");

// 例子二:给一个事件传递参数。
$("p").click( function (event, a, b) {
// 一个普通的点击事件时,a 和 b 是 undefined 类型
// 如果用下面的语句触发,那么 a 指向 "foo" , 而 b 指向 "bar"
} ).trigger("click", ["foo", "bar"]);

// 例子三:下面的代码可以显示一个 "Hello World"。
$("p").bind("myEvent", function(event, message1, message2) {
alert(message1 + ' ' + message2);
});
$("p").trigger("myEvent", ["Hello", "World!"]);


[b][color=#345286] ● triggerHandler(type, [data])[/color][/b]

/**
* 这个特别的方法将会触发指定的事件类型上所有绑定的处理函数。但不会执行浏览器默认动作。
*
* @type(String) 要触发的事件类型
* @data(Array) (可选) 传递给事件处理函数的附加参数
* @return jQuery Object
* @owner jQuery Object
*/
function triggerHandler(type, [data]);

// 例子:如果你对一个 focus 事件执行了 .triggerHandler(),浏览器默认动作将不会被触发,只会触发你
绑定的动作。
<button id="old">.trigger("focus")</button>
<button id="new">.triggerHandler("focus")</button><br/><br/>
<input type="text" value="To Be Focused"/>

$("#old").click(function() {
$("input").trigger("focus");
});
$("#new").click(function(){
$("input").triggerHandler("focus");
});
$("input").focus(function() {
$("<span>Focused!</span>").appendTo("body").fadeOut(1000);
});


[b][color=#345286] ● unbind([type], [data])[/color][/b]

/**
* 这个特别的方法将会触发指定的事件类型上所有绑定的处理函数。但不会执行浏览器默认动作。
*
* @type(String) (可选) 事件类型
* @data(Function) (可选) 要从每个匹配元素的事件中反绑定的事件处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function unbind([type], [data]);

// 例子一:把所有段落的所有事件取消绑定。
$("p").unbind();

// 例子二:将段落的 click 事件取消绑定。
$("p").unbind("click");

// 例子三:删除特定函数的绑定,将函数作为第二个参数传入。
var foo = function() {
// 处理某个事件的代码 ...
};
// 当点击段落的时候会触发 foo
$("p").bind("click", foo);
// 再也不会被触发 foo
$("p").unbind("click", foo);


[b][color=#345286] ● hover(over, out)[/color][/b]

/**
* 一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法。这是一个自定义的方法,它为频繁使用
* 的任务提供了一种 "保持在其中" 的状态。
*
* 当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数。当鼠标移出这个元素时,会触发指定的第二
* 个函数。而且,会伴随着对鼠标是否仍然处在特定元素中的检测(例如,处在 div 中的图像),如果是,则会
* 继续保持 "悬停" 状态,而不触发移出事件(修正了使用 mouseout 事件的一个常见错误)。
*
* @over(Function) 鼠标移到元素上要触发的函数
* @out(Function) 鼠标移出元素要触发的函数
* @return jQuery Object
* @owner jQuery Object
*/
function hover(over,out);

// 例子:鼠标悬停的表格加上特定的类。
$("td").hover(
function() {
$(this).addClass("hover");
},
function() {
$(this).removeClass("hover");
}
);


[b][color=#345286] ● toggle(fn, fn)[/color][/b]

/**
* 每次点击后依次调用函数。
*
* 如果点击了一个匹配的元素,则触发指定的第一个函数,当再次点击同一元素时,则触发指定的第二个函数,
* 如果有更多函数,则再次触发,直到最后一个。随后的每次点击都重复对这几个函数的轮番调用。
*
* @fn(Function) 第一数次点击时要执行的函数
* @fn2(Function) 第二数次点击时要执行的函数
* @fn3, fn4,... (Function) 更多次点击时要执行的函数
* @return jQuery Object
* @owner jQuery Object
*/
function toggle(fn, fn);

// 例子一:对表格的切换一个类。
$("td").toggle(
function() {
$(this).addClass("selected");
},
function() {
$(this).removeClass("selected");
}
);

// 例子二:对列表的切换样式。
<ul>
<li>Go to the store</li>
<li>Pick up dinner</li>
<li>Debug crash</li>
<li>Take a jog</li>
</ul>

$("li").toggle(
function() {
$(this).css({"list-style-type":"disc", "color":"blue"});
},
function() {
$(this).css({"list-style-type":"disc", "color":"red"});
},
function() {
$(this).css({"list-style-type":"", "color":""});
}
);


[b][color=#345286] ●●● 事件集合 ●●●[/color][/b]

[b][color=#345286] ● blur()[/color][/b]

/**
* 触发每一个匹配元素的 blur 事件。
*
* 这个函数会调用执行绑定到 blur 事件的所有函数,包括浏览器的默认行为。可以通过返回 false 来防止触发
* 浏览器的默认行为。blur 事件会在元素失去焦点的时候触发,既可以是鼠标行为,也可以是按 tab 键离开的。
*
* @return jQuery Object
* @owner jQuery Object
*/
function blur();

// 例子:触发所有段落的 blur 事件。
$("p").blur();


[b][color=#345286] ● blur(fn)[/color][/b]

/**
* 在每一个匹配元素的 blur 事件中绑定一个处理函数。
*
* blur 事件会在元素失去焦点的时候触发,既可以是鼠标行为,也可以是 按tab 键离开的。
*
* @fn(Function) 在每一个匹配元素的 blur 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function blur(fn);

// 例子:任何段落失去焦点时弹出一个 "Hello World!" 在每一个匹配元素的 blur 事件中绑定的处理函数。
$("p").blur( function() { alert("Hello World!"); } );


[b][color=#345286] ● change()[/color][/b]

/**
* 触发每个匹配元素的 change 事件。
*
* 这个函数会调用执行绑定到 change 事件的所有函数,包括浏览器的默认行为。可以通过在某个绑定的函数
* 中返回 false 来防止触发浏览器的默认行为。change 事件会在元素失去焦点的时候触发,也会当其值在获
* 得焦点后改变时触发。
*
* @return jQuery Object
* @owner jQuery Object
*/
function change();


[b][color=#345286] ● change(fn)[/color][/b]

/**
* 在每一个匹配元素的change事件中绑定一个处理函数。
*
* change 事件会在元素失去焦点的时候触发,也会当其值在获得焦点后改变时触发。
*
* @fn(Function) 在每一个匹配元素的 change 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function change(fn);

// 例子:给所有的文本框增加输入验证。
$("input[type='text']").change( function() {
// 这里可以写些验证代码 ...
});


[b][color=#345286] ● click()[/color][/b]

/**
* 触发每一个匹配元素的 click 事件。这个函数会调用执行绑定到 click 事件的所有函数。
*
* @return jQuery Object
* @owner jQuery Object
*/
function click();

// 例子:触发页面内所有段落的点击事件。
$("p").click();


[b][color=#345286] ● click(fn)[/color][/b]

/**
* 在每一个匹配元素的 click 事件中绑定一个处理函数。
*
* 点击事件会在你的指针设备的按钮在元素上单击时触发。单击的定义是在屏幕的同一点触发了 mousedown 和
* mouseup。几个事件触发的顺序是:mousedown -> mouseup -> click
*
* @fn(Function) 绑定到 click 事件的函数
* @return jQuery Object
* @owner jQuery Object
*/
function click(fn);

// 例子:将页面内所有段落点击后隐藏。
$("p").click( function() { $(this).hide(); });


[b][color=#345286] ● dblclick()[/color][/b]

/**
* 触发每一个匹配元素的 dbclick 事件。
*
* 这个函数会调用执行绑定到 dblclick 事件的所有函数,包括浏览器的默认行为。可以通过在某个绑定的函数
* 中返回 false 来防止触发浏览器的默认行为。dblclick 事件会在元素的同一点双击时触发。
*
* @return jQuery Object
* @owner jQuery Object
*/
function dblclick();


[b][color=#345286] ● dblclick(fn)[/color][/b]

/**
* 在每一个匹配元素的 dblclick 事件中绑定一个处理函数。
*
* 这个函数会调用执行绑定到 dblclick 事件的所有函数,包括浏览器的默认行为。可以通过在某个绑定的函数
* 中返回 false 来防止触发浏览器的默认行为。dblclick 事件会在元素的同一点双击时触发。
*
* @fn(String) 在每一个匹配元素的 dblclick 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function dblclick(fn);

// 例子:给页面上每个段落的双击事件绑上 "Hello World!" 警告框。
$("p").dblclick( function () { alert("Hello World!"); });


[b][color=#345286] ● error()[/color][/b]

/**
* 这个函数会调用执行绑定到 error 事件的所有函数,包括浏览器的默认行为。可以通过在某个绑定的函数中
* 返回 false 来防止触发浏览器的默认行为。
*
* @return jQuery Object
* @owner jQuery Object
*/
function error();


[b][color=#345286] ● error(fn)[/color][/b]

/**
* 在每一个匹配元素的 error 事件中绑定一个处理函数。
*
* 对于 error 事件,没有一个公众的标准。在大多数浏览器中,当页面的 JavaScript 发生错误时,window
* 对象会触发 error 事件;当图像的 src 属性无效时,比如文件不存在或者图像数据错误时,也会触发图像
* 对象的 error 事件。
*
* 如果异常是由 window 对象抛出,事件处理函数将会被传入三个参数:
* 1. 描述事件的信息("varName is not defined", "missing operator in expression", 等等。)
* 2. 包含错误的文档的完整 URL
* 3. 异常发生的行数
*
* 如果事件处理函数返回 true,则表示事件已经被处理,浏览器将认为没有异常。
*
* @fn(Function) 在每一个匹配元素的 error 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function error(fn);

// 例子一:在服务器端记录 JavaScript 错误日志。
$(window).error(function(msg, url, line){
jQuery.post("js_error_log.php", { msg: msg, url: url, line: line });
});

// 例子二:隐藏 JavaScript 错误。
$(window).error(function() {
return true;
});

// 例子三:给你 IE 的用户隐藏无效的图像。
$("img").error(function() {
$(this).hide();
});


[b][color=#345286] ● focus()[/color][/b]

/**
* 触发每一个匹配元素的 focus 事件。这将触发所有绑定的 focus 函数,注意,某些对象不支持 focus 方法。
*
* @return jQuery Object
* @owner jQuery Object
*/
function focus();

// 例子:当页面加载后将 id 为 "login" 的元素设置焦点。
$(document).ready(function(){
$("#login").focus();
});


[b][color=#345286] ● focus(fn)[/color][/b]

/**
* 在每一个匹配元素的 focus 事件中绑定一个处理函数。
*
* focus 事件可以通过鼠标点击或者键盘上的TAB导航触发。

* @fn(Function) 在每一个匹配元素的 focus 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function focus(fn);

// 例子:使人无法使用文本框。
$("input[type=text]").focus(function() {
this.blur();
});


[b][color=#345286] ● keydown()[/color][/b]

/**
* 触发每一个匹配元素的 keydown 事件。
*
* 这个函数会调用执行绑定到 keydown 事件的所有函数,包括浏览器的默认行为。可以通过在某个绑定的函数中
* 返回 false 来防止触发浏览器的默认行为。keydown 事件会在键盘按下时触发。

* @return jQuery Object
* @owner jQuery Object
*/
function keydown();


[b][color=#345286] ● keydown(fn)[/color][/b]

/**
* 在每一个匹配元素的keydown事件中绑定一个处理函数。keydown 事件会在键盘按下时触发。
*
* @fn(Function) 在每一个匹配元素的 keydown 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function keydown(fn);

// 例子:在页面内对键盘按键做出回应,可以使用如下代码:
$(window).keydown(function(event) {
switch(event.keyCode) {
// ...
// 不同的按键可以做不同的事情
// 不同的浏览器的keycode不同
// 更多详细信息:
http://unixpapa.com/js/key.html
// ...
}
});


[b][color=#345286] ● keypress()[/color][/b]

/**
* 触发每一个匹配元素的 keypress 事件。
*
* 这个函数会调用执行绑定到 keypress 事件的所有函数,包括浏览器的默认行为。可以通过在某个绑定的函数
* 中返回 false 来防止触发浏览器的默认行为。keypress 事件会在键盘按下时触发。
*
* @fn(Function) 在每一个匹配元素的 keydown 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function keypress();


[b][color=#345286] ● keypress(fn)[/color][/b]

/**
* 在每一个匹配元素的 keypress 事件中绑定一个处理函数。
*
* keypress 事件会在敲击按键时触发。 敲击按键的定义为按下并抬起同一个按键。这几个事件发生的顺序是:
* keydown -> keyup -> keypress
*
* @fn(Function) 在每一个匹配元素的 keydown 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function keypress(fn);


[b][color=#345286] ● keyup()[/color][/b]

/**
* 触发每一个匹配元素的 keyup 事件。
*
* 这个函数会调用执行绑定到 keyup 事件的所有函数,包括浏览器的默认行为。可以通过在某个绑定的函数
* 中返回 false 来防止触发浏览器的默认行为。keyup 事件会在按键释放时触发。
*
* @return jQuery Object
* @owner jQuery Object
*/
function keyup();


[b][color=#345286] ● keyup(fn)[/color][/b]

/**
* 在每一个匹配元素的 keyup 事件中绑定一个处理函数。keyup 事件会在键盘按下时触发。
*
* @fn(Function) 在每一个匹配元素的 keyup 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function keyup(fn);


[b][color=#345286] ● load(fn)[/color][/b]

/**
* 在每一个匹配元素的 load 事件中绑定一个处理函数。
*
* 如果绑定给 window 对象,则会在所有内容加载后触发,包括窗口,框架,对象和图像。如果绑定在元素上,
* 则当元素的内容加载完毕后触发。
*
* 注意:只有当在这个元素完全加载完之前绑定 load 的处理函数,才会在他加载完后触发。如果之后再绑定就
* 永远不会触发了。所以不要在 $(document).ready() 里绑定 load 事件,因为 jQuery 会在所有 DOM 加载完
* 成后再绑定 load 事件。

* @fn(Function) 在每一个匹配元素的 load 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function load(fn);


[b][color=#345286] ● mousedown(fn)[/color][/b]

/**
* 在每一个匹配元素的 mousedown 事件中绑定一个处理函数。mousedown 事件在鼠标在元素上点击后会触发。
*
* @fn(Function) 在每一个匹配元素的 mousedown 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function mousedown(fn);


[b][color=#345286] ● mousemove(fn)[/color][/b]

/**
* 在每一个匹配元素的 mousemove 事件中绑定一个处理函数。
*
* mousemove 事件通过鼠标在元素上移动来触发。事件处理函数会被传递一个变量 - 事件对象,其 .clientX
* 和 .clientY 属性代表鼠标的坐标。
*
* @fn(Function) 在每一个匹配元素的 mousemove 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function mousemove(fn);


[b][color=#345286] ● mouseout(fn)[/color][/b]

/**
* 在每一个匹配元素的 mouseout 事件中绑定一个处理函数。mouseout 事件在鼠标从元素上离开后会触发。
*
* @fn(Function) 在每一个匹配元素的 mouseout 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function mouseout(fn);


[b][color=#345286] ● mouseover(fn)[/color][/b]

/**
* 在每一个匹配元素的 mouseover 事件中绑定一个处理函数。mouseover 事件会在鼠标移入对象时触发。
*
* @fn(Function) 在每一个匹配元素的 mouseover 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function mouseover(fn);


[b][color=#345286] ● mouseup(fn)[/color][/b]

/**
* 在每一个匹配元素的 mouseup 事件中绑定一个处理函数。mouseup 事件会在鼠标点击对象释放时。
*
* @fn(Function) 在每一个匹配元素的 mouseup 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function mouseup(fn);


[b][color=#345286] ● resize(fn)[/color][/b]

/**
* 在每一个匹配元素的 resize 事件中绑定一个处理函数。当文档窗口改变大小时触发。
*
* @fn(Function) 在每一个匹配元素的 resize 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function resize(fn);

// 例子:让人每次改变页面窗口的大小时很郁闷的方法。
$(document).resize(function() {
alert("Stop it!");
});


[b][color=#345286] ● scroll(fn)[/color][/b]

/**
* 在每一个匹配元素的 scroll 事件中绑定一个处理函数。当滚动条发生变化时触发。
*
* @fn(Function) 在每一个匹配元素的 scroll 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function scroll(fn);

// 例子:当页面滚动条变化时,执行的函数。
$(window).scroll( function() { /* ...do something... */ } );


[b][color=#345286] ● select()[/color][/b]

/**
* 触发每一个匹配元素的 select 事件。
*
* 这个函数会调用执行绑定到 select 事件的所有函数,包括浏览器的默认行为。可以通过在某个绑定的函数
* 中返回 false 来防止触发浏览器的默认行为。
*
* @return jQuery Object
* @owner jQuery Object
*/
function select();

// 例子:触发所有 input 元素的 select 事件。
$("input").select();


[b][color=#345286] ● select(fn)[/color][/b]

/**
* 在每一个匹配元素的 select 事件中绑定一个处理函数。
*
* 当用户在文本框(包括 input 和 textarea)中选中某段文本时会触发 select 事件。
*
* @fn(Function) 在每一个匹配元素的 select 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function select(fn);


[b][color=#345286] ● submit()[/color][/b]

/**
* 触发每一个匹配元素的 submit 事件。
*
* 这个函数会调用执行绑定到 submit 事件的所有函数,包括浏览器的默认行为。可以通过在某个绑定的函数
* 中返回 false 来防止触发浏览器的默认行为。
*
* @return jQuery Object
* @owner jQuery Object
*/
function submit();

// 例子:提交本页的第一个表单。
$("form:first").submit();


[b][color=#345286] ● submit(fn)[/color][/b]

/**
* 在每一个匹配元素的 submit 事件中绑定一个处理函数。submit 事件将会在表单提交时触发。
*
* @fn(Function) 在每一个匹配元素的 submit 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function submit(fn);

// 例子:如果你要阻止表单提交。
$("form").submit(function() {
return false;
});


[b][color=#345286] ● unload(fn)[/color][/b]

/**
* 在每一个匹配元素的 unload 事件中绑定一个处理函数。
*
* @fn(Function) 在每一个匹配元素的 unload 事件中绑定的处理函数
* @return jQuery Object
* @owner jQuery Object
*/
function unload(fn);

// 例子:页面卸载的时候弹出一个警告框。
$(document).unload( function () { alert("Bye now!"); } );
好的,关于 jQuery事件,我可以和你分享一些学习笔记。 1. 绑定事件jQuery 中,我们可以通过以下方式来绑定事件: ``` $(selector).event(function(){ // 事件处理程序 }) ``` 其中,`selector` 表示要绑定事件的元素,`event` 表示要绑定的事件类型,比如 `click`、`mouseover` 等等。事件处理程序则是在事件触发时要执行的代码块。 2. 多个事件绑定 我们可以通过 `on()` 方法来同时绑定多个事件: ``` $(selector).on({ event1: function(){ // 事件处理程序1 }, event2: function(){ // 事件处理程序2 } }) ``` 这样,当 `event1` 或 `event2` 中任意一个事件触发时,对应的处理程序都会被执行。 3. 解除事件 如果需要解除某个元素的事件处理程序,可以使用 `off()` 方法: ``` $(selector).off(event); ``` 其中,`event` 表示要解除的事件类型。如果不指定事件类型,则会解除该元素上所有的事件处理程序。 4. 事件委托 在 jQuery 中,我们可以使用事件委托来提高性能。事件委托是指将事件绑定到父元素上,而不是绑定到子元素上,然后通过事件冒泡来判断是哪个子元素触发了该事件。这样,当子元素数量较多时,只需要绑定一次事件,就可以监听到所有子元素的事件。 ``` $(selector).on(event, childSelector, function(){ // 事件处理程序 }) ``` 其中,`selector` 表示父元素,`event` 表示要绑定的事件类型,`childSelector` 表示要委托的子元素的选择器,事件处理程序则是在子元素触发事件时要执行的代码块。 以上是 jQuery事件的一些基本操作,希望对你有所帮助。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值