如何在onclick事件中调用多个JavaScript函数?
有什么办法可以使用onClick
html属性来调用多个JavaScript函数吗?
onclick="doSomething();doSomethingElse();"
但实际上,最好不要使用onclick
,并通过Javascript代码将事件处理程序附加到DOM节点。 这被称为不显眼的JavaScript 。
一个定义了1个函数的链接
<a href="#" onclick="someFunc()">Click me To fire some functions</a>
从someFunc()
多个函数
function someFunc() { showAlert(); validate(); anotherFunction(); YetAnotherFunction(); }
如果只使用JavaScript而不使用jQuery,则这是所需的代码
var el = document.getElementById("id"); el.addEventListener("click", function(){alert("click1 triggered")}, false); el.addEventListener("click", function(){alert("click2 triggered")}, false);
我将使用element.addEventListener
方法将其链接到一个函数。 从这个function你可以调用多个function。
我看到的将事件绑定到一个函数然后调用多个函数的优点是,您可以执行一些错误检查,还有一些if语句,以便某些函数只有在符合某些条件时才会被调用。
当然,只需绑定多个监听器即可。
Short cutting with jQuery
$("#id").bind("click", function() { alert("Event 1"); }); $(".foo").bind("click", function() { alert("Foo class"); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="foo" id="id">Click</div>
你可以把所有的函数合并成一个,然后调用它们。像Ramdajs这样的函数库可以将多个函数组合成一个函数。
<a href="#" onclick="R.compose(fn1,fn2,fn3)()">Click me To fire some functions</a>
或者你可以把作品作为一个独立的function在js文件中并调用它
const newFunction = R.compose(fn1,fn2,fn3); <a href="#" onclick="newFunction()">Click me To fire some functions</a>