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. Nested weights are bad for performance

    警告信息“Nested weights are bad for performance”的消除方法 原因分析:在布局进行嵌套使用时,父布局与子布局都使用了android:layout_weight,但 ...

  2. dedecms如何修改共0页/0条记录为英文版？

    近日,在测试一个网站功能的时候,发现在搜索结果的下面为中文的“共0页/0条记录”,但客户的网站为英文版,所以我们需要将搜索的结果信息也要显示为英文,好了,我们开始动手修改dedecms的文件,以达到我 ...

  3. (简单) HUST 1017 Exact cover , DLX+精确覆盖。

    Description There is an N*M matrix with only 0s and 1s, (1 <= N,M <= 1000). An exact cover is ...

  4. (中等) POJ 2828 Buy Tickets , 逆序+线段树。

    Description: Railway tickets were difficult to buy around the Lunar New Year in China, so we must ge ...

  5. ZOJ 3923 Handshakes

    水题. 算一下每个人和之前的人握手次数+之后的人和这个人握手次数.取最大值. #include<cstdio> #include<cstring> #include<cm ...

  6. 51nod贪心算法教程

    51nod确实是一个好oj,题目质量不错,wa了还放数据,学习算法来说挺好的,这次我做了几个水的贪心,虽然水,但是确实都很典型. 教程链接:http://www.51nod.com/tutorial/ ...

  7. display属性及inline-block值（可用来布局）

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度 <div& ...

  8. hdu 2614

    #include<stdio.h> int map[99][99]; int vist[99]; int sum=1; int maxsum=1; int max=0; int N; vo ...

  9. mysql 安装错误 解决方法

    错误及警告信息:TIMESTAMP with implicit DEFAULT value is deprecated. Please use --explicit_defaults_for_time ...

  10. python 数组的del ,remove,pop区别

    以a=[1,2,3] 为例,似乎使用del, remove, pop一个元素2 之后 a都是为 [1,3], 如下: >>> a=[1,2,3] >>> a.rem ...