Qco*_*com 215 html javascript methods onclick
有没有办法使用onclick
html属性来调用多个JavaScript函数?
bra*_*rad 358
onclick="doSomething();doSomethingElse();"
Run Code Online (Sandbox Code Playgroud)
但实际上,你最好不要使用它onclick
并通过你的Javascript代码将事件处理程序附加到DOM节点.这被称为不引人注目的JavaScript.
Mar*_*rko 67
定义了1个函数的链接
<a href="#" onclick="someFunc()">Click me To fire some functions</a>
Run Code Online (Sandbox Code Playgroud)
从中获取多个功能 someFunc()
function someFunc() {
showAlert();
validate();
anotherFunction();
YetAnotherFunction();
}
Run Code Online (Sandbox Code Playgroud)
ana*_*han 37
如果您只使用JavaScript而不是jQuery,那么这就是所需的代码
var el = document.getElementById("id");
el.addEventListener("click", function(){alert("click1 triggered")}, false);
el.addEventListener("click", function(){alert("click2 triggered")}, false);
Run Code Online (Sandbox Code Playgroud)
Gir*_*ane 10
我会使用该element.addEventListener
方法将其链接到一个函数.从该功能,您可以调用多个功能.
我在将事件绑定到单个函数然后调用多个函数时看到的优点是,您可以执行一些错误检查,使用一些if else语句,以便只有在满足某些条件时才会调用某些函数.
当然,只需将多个侦听器绑定到该侦听器即可。
Short cutting with jQuery
$("#id").bind("click", function() {
alert("Event 1");
});
$(".foo").bind("click", function() {
alert("Foo class");
});
Run Code Online (Sandbox Code Playgroud)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="foo" id="id">Click</div>
Run Code Online (Sandbox Code Playgroud)
ES6 反应
<MenuItem
onClick={() => {
this.props.toggleTheme();
this.handleMenuClose();
}}
>
Run Code Online (Sandbox Code Playgroud)
var btn = document.querySelector('#twofuns');
btn.addEventListener('click',method1);
btn.addEventListener('click',method2);
function method2(){
console.log("Method 2");
}
function method1(){
console.log("Method 1");
}
Run Code Online (Sandbox Code Playgroud)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Pramod Kharade-Javascript</title>
</head>
<body>
<button id="twofuns">Click Me!</button>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
您可以使用一种或多种方法来实现/调用一个事件。