Question

我想知道是否有可能有两个onclicks，在一个HTML标签内部都可以工作，如果有的话怎么样？另外，至少有一些方法可以通过一次点击来执行两个独立的代码，即

<html>
<body>
<button type="button" onclick=(operation example a), (operation example b)>example</button>
</body>
</html>

Answer 1

将这些分隔为;分号，您可以向onclick添加多个函数

<button type="button" onclick="operation(exampleA); operation(exampleB)">example</button>

另一种选择是将两个函数放在一个函数中并调用onclick。

function triggerOnClick(){
    functionOne();
    functionTwo();
}

<强> HTML

<button type="button" onclick="triggerOnClick()">example</button>

Answer 2

您也可以使用.addEventListener（）方法。

var btn = document.getElementById('myButton');
btn.addEventListener('click', myFunctionA);
btn.addEventListener('click', myFunctionB);
btn.addEventListener('click', myFunctionC);

function myFunctionA(){ //do something
}
function myFunctionB(){ //do something
}
function myFunctionC(){ //do something
}

您可以根据需要添加任意数量而不会覆盖事件。

PS。使用此方法时，请忽略“on”一词。所以它只有click，mousemove，mouseover，keypress，yada yada yada

一个onclick中的两个独立操作

2 个答案: