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');

    });

}

jQuery事件触发和参数传递的更多相关文章

  1. jQuery事件触发前后进行其他的操作

    <!-- 事件触发前后执行其他操作的三种方式: 多适用于:公众号的订阅,有订阅的可以收到文章,没有订阅的收不到文章. --> <!DOCTYPE html> <html ...

  2. HTML Select 标签选择后触发jQuery事件代码实例

    页面设计原由: 因为很多客户不知道如何来到我们公司,领导想让我在微信公众号上面做一个链接,客户可以直接通过微信公众号打开地图并导航到我们公司的办公地点. 实现起来并不难,但由于公司有很多办事处,所以需 ...

  3. jquery trigger 触发事件小计 -- 关于a标签

    jquery -- trigger触发执行事件方法虽然好用,偶尔也会出些小问题. 在最近得一个项目中需要触发a标签的点击事件时,我就遇到了点小问题.我很想当然的写层这样:$("a" ...

  4. jquery 事件 多次绑定，多次触发，怎么清除历史绑定事件

    Jquery在处理事件的时候有时候会遇到预想不到的结果 如下 <a id="link_foo">Foo</a> <script type=" ...

  5. 解决jQuery中dbclick事件触发两次click事件

    首先感谢这位小哥!http://qubernet.blog.163.com/blog/static/1779472842011101505853216/ 太长姿势了. 在jQuery事件绑定中,dbc ...

  6. 第77天：jQuery事件绑定触发

    一.元素操作 1. 高度和宽度 $(“div”).height(); // 高度 $(“div”).width(); // 宽度 .height()方法和.css(“height”)的区别: 返回值不 ...

  7. js进阶 12-14 jquery的事件触发函数是哪两个

    js进阶 12-14 jquery的事件触发函数是哪两个 一.总结 一句话总结:trigger和triggerHandler 1.trigger传额外参数时候的注意事项是什么? 注意样例中是三个参数 ...

  8. jQuery事件绑定，解绑，触发

    事件绑定 1.bind(type,[data],fn) --type: 含有一个或多个事件类型的字符串,由空格分隔多个事件.比如"click"或"submit" ...

  9. Javascript和jquery事件--点击事件和触发超链接

    前面的不过是一些基础的知识,真正的一些事件还是有点不同.还有一些命名空间的问题.不过现在ie也开始接受W3C标准,而且平时开发也很少考虑ie了,一些事件就不考虑ie了. 点击事件--click 大部分 ...

随机推荐

  1. 更少的直接百度，更多的取看API

    很多时候我们会对于一个jar包中的一个类的某个方法犯迷糊 我们不知道传进去什么样子的参数,这个方法的返回值到底是什么样的. 更多的时候我们不知道这个jar中有没有我们想要的这个方法. 很多时候以前我都 ...

  2. C. Bear and Colors

    C. Bear and Colors time limit per test 2 seconds memory limit per test 256 megabytes input standard ...

  3. webpack.config.js 参数简单了解

    webpack.config.js文件通常放在项目的根目录中,它本身也是一个标准的Commonjs规范的模块. var webpack = require('webpack'); module.exp ...

  4. Oracle存储过程中如何使用游标

    --本存储过程的功能:把test_tbl2中与test_tbl1中ID相同但salary不同的记录中的salary的值更新为test_tbl1中的salary的值--创建存储过程create or r ...

  5. git使用系列（一）

    git commit 的时候出现了问题: change not staged for commit. no changes added to commit(use "git add" ...

  6. 外网主机访问虚拟机下的Web服务器_服务器应用_Linux公社-Linux系统门户网站

    body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...

  7. Nutz 第一个Demo

    Nut 是什么 我这就不多解释 知道是个javaweb框架 如想仔细了解请移步管网 http://nutzam.com/ 一.项目结构(直接看图 ) 需要注意的是 src和conf 都为源码包 con ...

  8. 【转】 完美配置Tomcat的HTTPS

    Tomcat配置HTTPS的文章到处都有,过程也比较简单,随后文中会转一段过来. 但对于启用APR情况下报异常“java.lang.Exception: Connector attribute SSL ...

  9. hadoop如何查看文件系统

    1.查看当前的文件系统 [root@hadoopmaster bin]# . itemsdrwxr 00 00 /user 当然也可以以浏览器中这样查看localhost:50070   这就是had ...

  10. Objective C HMAC-MD5

    - (NSString*) HMACWithSecret:(NSString*) secret andString:(NSString *)str { unsigned long encode = C ...