时间戳

首页 > 解决方案 > 通过鼠标单击或输入键执行功能的有效方法

javascript - 通过鼠标单击或输入键执行功能的有效方法

问题描述

我希望我的函数在按下提交按钮（已经存在）或按下 3 个输入中的任何一个（Id：taskInfo、dueDate、dueTime）中的任何一个中的 enter 键时执行。

我试过分离函数并这样做，但它根本不起作用..

     function init() {

         window.notes = getLocalStorage('notes') || [];
         setNotesUi();

         // make note with form inputs by using button +reset notes+ set localStorage

         var submitElement = document.getElementById('submit');
         submitElement.addEventListener('click', function ()

将需要以下函数来执行，同时在任何地方按下回车键，或者特别是在 3 个名为（taskInfo、dueDate、dueTime）的输入上执行，就像这里它只需要在提交按钮上单击鼠标即可

 {
             var taskInfoElement = document.getElementById('taskInfo');
             var dueDateElement = document.getElementById('dueDate');
             var dueTimeElement = document.getElementById('dueTime');

             var note = {
                 taskInfo: taskInfoElement.value,
                 dueDate: dueDateElement.value,
                 dueTime: dueTimeElement.value
             };

             notes.push(note);
             setNotesUi();
             setLocalStorage('notes', notes);
         });
     }

将需要以下函数来执行，同时在任何地方按下回车键，或者特别是在 3 个名为（taskInfo、dueDate、dueTime）的输入上执行，就像这里它只需要在提交按钮上单击鼠标即可

标签： javascript

解决方案

表单已经处理了这个。只需添加一个提交处理程序。在任何文本框上输入都会触发它。不需要额外的 JavaScript。

document.querySelector("#myForm").addEventListener("submit", evt => {
console.log("Submit called");
evt.preventDefault();
});
<form id="myForm">
  <label for="a">A</label><input id="a"/>
  <label for="b">B</label><input id="b"/>
  <label for="c">C</label><input id="c"/>
  <button>d</button>
</form>

推荐阅读