jQuery事件觸發和參數傳遞：
參考：http://www.jb51.net/article/36249.htm
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/"; %> <!DOCTYPE html> <html> <head> <base href="<%=basePath%>"> <meta charset="UTF-8"> <title>b index</title> <link rel='stylesheet' type="text/css" href='b/css/bootstrap.css'> </head> <body style="margin:150px;"> <div id="div001">div001</div> <div id="div002">div002</div> <div id="div003">div003</div> <div> <button id="btn001">click me to log something </button> <button id="btn002">click me to trigger btn001 function </button> <button id="btn003">click me to trigger btn001 click use s,s,s</button> <button id="btn004">click me to trigger btn001 click use e,s,s</button> <button id="btn005">click me to trigger btn001 by trigger</button> <button id="btn006">click me to trigger btn001 by click</button> <button id="btn007">click me to trigger btn001 by trigger(type,data)</button> <button id="btn008">click me to trigger btn001 by click(data,btn001fun)</button> <button id="btn009">click me to trigger btn001 by click(data,function(){})</button> <button id="btn010">click me to trigger btn001 by click(function(){})</button> </div> <script type="text/javascript" src="js/jquery-1.11.1.js"></script> <script type="text/javascript" src="b/js/bootstrap.js"></script> <script type="text/javascript" src="js/index033.js"></script> </body> </html>
$(function() { $('#btn001').click(btn001Click); $('#btn002').click(btn002Click); $('#btn003').click(btn003Click); $('#btn004').click(btn004Click); $('#btn005').click(btn005Click); $('#btn006').click(btn006Click); $('#btn007').click(btn007Click); $('#btn008').click(btn008Click); $('#btn009').click(btn009Click); $('#btn010').click(btn010Click); }); // 這樣的情況下，如果是事件調用，a參數就是jQuery.Event； function btn001Click(a, b, c) { console.log('this is in btn001Click'); console.log(arguments.length); for (var i = 0, len = arguments.length; i < len; i++) { console.log((i + 1) + ':' + arguments[i]); } } function btn002Click() { // 這樣只是一般的函數調用 btn001Click('a', 'b', 'c'); } function btn003Click() { // 這樣沒有反應，相當於重新給btn001賦予click事件，但是還沒有函數； $('#btn001').click('a', 'b', 'c'); // 但是綁定之后點擊按鈕會出現問題；Uncaught TypeError: undefined is not a function } function btn004Click() { // 這樣會報錯，e is not defined // $('#btn001').click(e, 'b', 'c'); } function btn005Click() { // 可以觸發事件 $('#btn001').trigger('click'); } function btn006Click() { // 可以觸發事件 $('#btn001').click(); } function btn007Click() { // 這樣可以正常調用，並且可以把參數傳進去，第一個參數還是jQuery.Event // 只能傳進去一個參數,下面的情況只能把a傳進去；而且這樣jQuery.Event.data是null； $('#btn001').trigger('click', 'a', 'b', 'c'); // 這樣會報異常， e is not defined // $('#btn001').trigger('click',[e,'a','b','c']); } function btn008Click() { console.log('btn008Click'); // 這樣只是進行了綁定，不是進行執行；如果初始化的時候綁定過事件，那么這樣就綁定兩個事件了； // 可以用a.data來查看是哪一個事件執行了； $('#btn001').click([ 'a', 'b', 'c' ], btn001Click); // 如果綁定多個參數，綁定之后點擊按鈕會出現問題；Uncaught TypeError: undefined is not a function // 只能傳遞一個對象，在btn001Click中使用jQuery.Event.data來獲取參數； } function btn009Click() { console.log('btn009Click'); // 只是進行了綁定，必須點擊btn001才可以觸發； $('#btn001').click([ 'a', 'b', 'c' ], function(a, b) { // 只傳遞一個對象，可以保證不報錯了，在函數中使用a.data來獲取參數； console.log('this is anonymous function'); }); } function btn010Click() { console.log('btn010Click'); $('#btn001').click(function() { console.log('this is anonymous function'); }); }