javascript中點擊事件的雙重功能

Question

如何在不與第一個功能沖突的情況下在同一個單擊按鈕上添加雙重功能。

btn.addEventListener('click', drop);

function drop(){
items.style.display = 'block';
items.style.display = 'none';

html中的下拉菜單。

Answer 1

只需多次使用addEventListener綁定函數。

 const btn = document.getElementById('btn'); btn.addEventListener('click', job1); btn.addEventListener('click', job2); function job1(){ console.log('Job 1 triggered'); } function job2(){ console.log('Job 2 triggered'); }

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

Answer 2

您可以將函數包裝在一個函數中：

 const btn = document.getElementById('btn'); btn.addEventListener('click', () => {drop(), other()}); function drop(){ // items.style.display = 'block'; // items.style.display = 'none'; console.log('drop triggered'); } function other(){ console.log('other triggered'); }

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