為單擊搜索按鈕和輸入按鈕添加事件偵聽器

Question

我正在嘗試向搜索按鈕添加事件偵聽器。 我已經有了回車按鈕的事件監聽器，但希望人們也能夠點擊搜索按鈕。 例如，在移動設備上，他們將不得不這樣做。 有人可以幫助我嗎？ 任何幫助將不勝感激。 謝謝

enquiryRef.addEventListener('keypress', checkIfEnter);

function checkIfEnter(event){
  if (event.keyCode === 13) {
    getResults(enquiryRef.value);
  }
}

Answer 1

也將事件偵聽器添加到搜索按鈕。

searchBtn.addEventListener('keypress', checkIfEnter);

Answer 2

您可以向一個元素添加多個事件偵聽器，但是當然，您想要在單擊時執行的操作與您想要在用戶輸入 Enter 時執行的操作不同，因為沒有 Enter 鍵可供檢查。 所以創建另一個函數，比如 userClicked，它只調用 getResults 的值，就像用戶按下 Enter 鍵一樣。

enquiryRef.addEventListener('keypress', checkIfEnter);

function checkIfEnter(event){
  if (event.keyCode === 13) {
    getResults(enquiryRef.value);
  }
}

enquiryRef.addEventListener('click', userClicked);

function userClicked(event){
    getResults(enquiryRef.value);
}

根據您的用例，您可能想或不想停止點擊的傳播。