jQuery

Question

我正在尝试在 ajax 表单上添加一项功能，以便能够同时使用 Submit Button 和 Ctrl+Enter 功能。
它的两个单独的表单，它应该保持原样，但是必须有两个事件可用于提交 ajax 表单。
这是我到目前为止所做的：

  $(document).ready(function() {
    $(".form").on('submit keydown',(function(e) {
      e.preventDefault();
      $.ajax({
        success: function(data) {
          $('.result').html('Ajax Submit');
        },
      });
    }));
  });

<input class="search1">
  <form class="form">
    <button>Submit</button>
  </form>
  <div class="result"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

Answer 1

鉴于您在问题下的评论中声明 input 不会放置在 form 元素内（尽管确实应该是，因为它的可访问性更好，而且它会在不需要 JS 干预的情况下为你解决问题），你可以通过附加一个 keyup 事件处理程序来实现你的目标input 元素并监听 CTRL+Return 和弦。

另请注意，您的 AJAX 请求需要至少包括 url 和 data。

jQuery($ => {
  let $form = $('.form');
  let $search = $('.search1').on('keyup', e => {
    if (e.ctrlKey && e.keyCode === 13)
      $form.submit();
  });
  
  $form.on('submit', e => {
    e.preventDefault();
    console.log('making ajax request...');
    
    /*
    $.ajax({
      url: '/search',
      data: {
        term: $search.val()
      },  
      success: function(data) {
        $('.result').html('Ajax Submit');
      }
    });
    */
  });
});

<input class="search1">
<form class="form">
  <button>Submit</button>
</form>
<div class="result"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

jQuery - 如何在 Ajax 表单提交中添加 "or"

jQuery - How to add "or" in the Ajax form submission

ajax

forms

submit