是否有任何方法使用onclick html属性调用多个JavaScript函数?
当前回答
如果只使用JavaScript而不使用jQuery,则需要此代码
var el = document.getElementById("id");
el.addEventListener("click", function(){alert("click1 triggered")}, false);
el.addEventListener("click", function(){alert("click2 triggered")}, false);
其他回答
我会用元素。addEventListener方法将其链接到函数。从该函数可以调用多个函数。
我认为将一个事件绑定到一个函数,然后调用多个函数的好处是,你可以执行一些错误检查,有一些if else语句,这样一些函数只在满足某些条件时才会被调用。
这是brad的另一种回答,你可以这样用逗号
onclick="funA(), funB(), ..."
但是最好不要使用这种方法-对于小型项目,你可以只在一个函数调用的情况下使用onclick(更多:更新的不显眼的javascript)。
函数funA() { console.log (' A '); } 函数funB(点击元素){ console.log('B: ' + click . innertext); } 函数funC(cilckEvent) { console.log('C: ' + cilckEvent.timeStamp); } div{光标:指针} <div onclick="funA(), funB(this), funC(event)"< / div > >点击我
您可以将所有函数组合成一个并调用它们。像Ramdajs这样的库具有将多个函数组合成一个函数的功能。
<a href="#" onclick="R.compose(fn1,fn2,fn3)()">Click me To fire some functions</a>
或者你可以把合成作为一个单独的函数在js文件中调用它
const newFunction = R.compose(fn1,fn2,fn3);
<a href="#" onclick="newFunction()">Click me To fire some functions</a>
var btn = document.querySelector('#twofuns'); btn.addEventListener(“点击”,method1); btn.addEventListener(“点击”,method2); 函数method2 () { console.log(方法2); } 函数method1 () { console.log(方法1); } <!DOCTYPE html > < html > < >头 < meta charset = " utf - 8 " > <meta name="viewport" content="width=device-width"> <标题> Pramod Kharade-Javascript < /名称> > < /头 身体< > <button id="twofuns">点击我!< /按钮> 身体< / > < / html >
您可以使用一个或多个方法实现/调用一个事件。
当然,只需将多个侦听器绑定到它。
jQuery速成
$(“#id”).bind(“click”, function() { 警报(“事件 1”); }); $(“.foo”).bind(“click”, function() { 警报(“Foo 类”); }); <script src=“https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js”></script> <div class=“foo” id=“id”>Click</div>
推荐文章
- 将lodash导入到angular + typescript应用程序中
- 什么时候使用setAttribute vs .attribute=在JavaScript?
- 每60秒调用一个函数
- 如何隐藏元素而不让他们在页面上占用空间?
- 我如何链接到谷歌地图与特定的经度和纬度?
- 我如何上传一个文件与JS获取API?
- 在JavaScript中是否有一个“not in”操作符来检查对象属性?
- 防止跨度元件断行
- 我如何能得到滚动条的位置与JavaScript?
- JavaScript中的yield关键字是什么?
- 如何显示一个对象的所有方法?
- 如何防止滚动条重新定位网页?
- .js和.mjs文件有什么区别?
- Axios处理错误
- ESLint解析错误:意外的令牌