当传递参数值时，使用"匿名函数"调用带参数的函数：

<body>

  <button id="btn">click me</button>

  <p id="show"></p>

  <script>

     var p1=5;

     var p2=7;         
     document.getElementById("btn").addEventListener("click",
       function(){
         add(p1,p2);
       })

     function add(a,b){

        var sum=a+b;

        document.getElementById("show").innerHTML=sum;

     }

  </script>

</body>

若直接传add(p1,p2),不需要点击，直接显示运算结果。

原因：

第二个参数是一个函数，传add(p1,p2)的话，相当于传的add(p1,p2)返回值。

addEventListener补充：

1. 可以在文档中添加许多事件，添加的事件不会覆盖已存在的事件。

document.getElementById("myBtn").addEventListener("click", myFunction);

document.getElementById("myBtn").addEventListener("click", someOtherFunction);

2. 可以在同一个元素中添加不同类型的事件。

document.getElementById("myBtn").addEventListener("mouseover", myFunction);

document.getElementById("myBtn").addEventListener("click", someOtherFunction);

document.getElementById("myBtn").addEventListener("mouseout", someOtherFunction);

3. Internet Explorer 8 及更早IE版本不支持 addEventListener() 方法，，Opera 7.0 及 Opera 更早版本也不支持。 但是，对于这些不支持该函数的浏览器，你可以使用 attachEvent() 方法来添加事件句柄

var x = document.getElementById("myBtn");

if (x.addEventListener) {                    //所有主流浏览器，除了 IE 8 及更早 IE版本

    x.addEventListener("click", myFunction);

} else if (x.attachEvent) {                  // IE 8 及更早 IE 版本

    x.attachEvent("onclick", myFunction);

}

addEventListener调用带参数函数的更多相关文章

  1. c# 多线程 调用带参数函数

    线程操作主要用到Thread类,他是定义在System.Threading.dll下.使用时需要添加这一个引用.该类提供给我们四个重载的构造函数(以下引自msdn).       Thread (Pa ...

  2. C#线程调用带参数的方法

    在 .NET Framework 2.0 版中,要实现线程调用带参数的方法有两种办法.第一种:使用ParameterizedThreadStart.调用 System.Threading.Thread ...

  3. Java程序调用带参数的shell脚本返回值

    Java程序调用带参数的shell脚本返回值 首先来看看linux中shell变量(\(#,\)@,$0,$1,\(2)的含义解释 变量说明: -  \)$  Shell本身的PID(ProcessI ...

  4. 定时器(setTimeout/setInterval)调用带参函数失效解决方法

    也许你曾碰到过这样的问题,不管是setInterval()还是setTimeout(),当code参数里放一个带参函数时,定时器都会失效,看下面这个例子: function test(str){ al ...

  5. Python中，关于调用带参函数，一些需要注意的问题（监听时）

    1.如果监听调用的函数不带参数(start()) Button.clicked.connect(start)) def strat(): ... 2.如果监听调用的函数带参数(start(x,y)) ...

  6. C#调用带参数的python脚本

    问题描述:使用C#调用下面的带参数的用python写的方法,并且想要获取返回值. def Quadratic_Equations(a,b,c): D=b**2-4*a*c ans=[] ans.app ...

  7. js addEventListener调用传参函数

    先看这段代码 function abc(key){ console.log(key); } for(let i=0;i<oInput.length;i++){ oInput[i].addEven ...

  8. setTimeout调用带参数的函数的方法

    function test(s){    alert(s);}window.setTimeout(function(){test('str');},1000);这样就可以了...为什么是这样呢.因为s ...

  9. JavaScript 带参数函数定义

    函数的参数parameters在函数中充当占位符(也叫形参)的作用,参数可以为一个或多个.调用一个函数时所传入的参数为实参,实参决定着形参真正的值. 这是带有两个参数的函数, param1 和 par ...

随机推荐

  1. svn强制commit写log

    https://tortoisesvn.net/docs/nightly/TortoiseSVN_en/tsvn-howto-minlogmsgsize.html Force users to ent ...

  2. R t-test cor.test

    a = c(175, 168, 168, 190, 156, 181, 182, 175, 174, 179)b = c(185, 169, 173, 173, 188, 186, 175, 174, ...

  3. CF1137C Museums Tour

    思路 强连通分量的好题 对于每个博物馆,因为时间的限制条件,不好直接统计, 发现d很小,可以建出d层分层图,原图<u,v>的边变成<u,i>到<v,i+1>的边,& ...

  4. P3273 [SCOI2011]棘手的操作

    吐槽 上午风浔凌julao问我的神题 操作又多又毒瘤又棘手... 然后bzoj题号正好是2333,2333333333 思路 貌似只有我是这么写的 线段树合并, 每个线段树存每个连通块的信息,维护点的 ...

  5. [转载]linux下core文件设置与查看

    转自:https://blog.csdn.net/dingqinghui/article/details/77855330?locationNum=9&fps=1 linux下core文件设置 ...

  6. 1、http协议基础及IO模型

    Nginx (web server,web reverse proxy): http协议:80/tcp,HyperText Transfer Procotol http协议版本: HTTP/0.9:原 ...

  7. CentOS7时间和日期的同步 (chrony和)

    CentOS 6版本,使用 hwclock CentOS 7版本,使用timedatectl 1.基本概念 1.1 GMT,UTC,CST,DST时间 世界标准时间 整个地球分为二十四时区,每个时区都 ...

  8. uoj #228. 基础数据结构练习题 线段树

    #228. 基础数据结构练习题 统计 描述 提交 自定义测试 sylvia 是一个热爱学习的女孩子,今天她想要学习数据结构技巧. 在看了一些博客学了一些姿势后,她想要找一些数据结构题来练练手.于是她的 ...

  9. Java中的异常 Exceptions

    1. 概念 exception是“exceptional event”的缩写,是指执行程序中发生的事件,破坏了程序的正常执行流程.Java 异常处理机制使程序更加健壮易于调试,它可以告诉程序员三个问题 ...

  10. 2.0 vue内置指令与自定义指令

    1.1 常用内置指令 1) v:text : 更新元素的 textContent 2) v-html : 更新元素的 innerHTML 3) v-if : 如果为 true, 当前标签才会输出到页 ...