javascript - 如何使用键 enter + onclick 关闭我的模式

Question

我有一个接受输入并将其显示在屏幕上的模式，当我按下“保存”按钮时它工作正常。但是我希望它在我按下回车键时起作用。我找到了一些答案，但它并不真正适合我的代码，因为我同时想要 onClick 和按回车键。我也尝试过将按钮更改为“提交”类型，但效果不佳。有没有一种快速简单的方法可以用我当前的代码做到这一点？

    function addMovie() {
    
      var i = document.getElementById('addedMovie');
      var d = document.createElement('div');
      d.id = "new-movie";
      d.innerHTML = "<p>" + "<img src='../images/movie.png'>" + i.value + "</p>";
      var p = document.getElementById('related-movies');
    
      p.appendChild(d);
    
    }

      <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4 class="modal-title">Add a movie</h4>
          </div>
          <div class="modal-body">
            <input type="text" placeholder="Movie title" name="movies[]" class="modal-input" id="addedMovie">
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-login" data-dismiss="modal" onClick="addMovie();clearModal()">Save</button>
          </div>
        </div>

或者是否有更简单的方法来做到这一点(例如，通过在模式中提交输入并将其显示在我选择的 div 上？因为目前我只是在输入中获取值，但我没有不认为我将它保存到一个变量中)

非常感谢您的帮助!

Answer 1

添加检查回车键 -

 <div id="modal" class="modal-content"> ...
   <input type="text" placeholder="Movie title" name="movies[]" class="modal-input" id="addedMovie" onkeypress="check(event)">
 </div>

function check(e) {
  if(e.key === "Enter") {
    addMovie();
    $('#modal').modal('hide');
  }
}