提交ajax表单答案

【问题标题】：Submitting ajax form提交ajax表单
【发布时间】：2021-11-13 16:45:05
【问题描述】：

我需要提交此表单才能使用。这是我的代码，但它不想工作。必须使用此链接发送请求，例如，https://www.eymedic.form.php。如何让它正常工作？

<form method="POST" id="form" action="#" class="form">     
      <div class="field">
        <label for="input-kitId" class="label is-size-7 has-text-weight-light has-text-left">Order ID</label>
        <div class="field"><div class="control is-expanded">
          <input type="number" id="input-kitId" class="home-form__input input is-danger" name="number" value="" placeholder="Order ID">
          </div>
        </div>
      </div>
      
      <div class="field">
        <label for="input-firstName" class="label is-size-7 has-text-weight-light has-text-left">Email</label>
        <div class="field"><div class="control is-expanded">
          <input type="email" id="input-firstName" class="home-form__input input" name="email" value="" placeholder="Email">
          </div>
        </div>
      </div>
      
      <button type="submit" class="button is-midnightBlue">Generate Booking Reference</button>
    </form>
    
    
  </div>
</div>
    
   
<script>
  
$( "submit" ).click(function() {
      if(form.val()) {
            var msg = $("#form").serialize();
            $.ajax({
              type: 'POST',
              url: 'https://www.harleymedic.co.uk/qrcodes/form.php',
              data: msg,
              success: function(data) {
                console.log(data);
                if (data.status === 'OK') {window.location.href='second_page.html'}
                else {alert(data.message)};
              }
            });
        };
    });
  
</script>

【问题讨论】：

您没有取消默认提交 - 而且您没有任何 submit 元素。
$("#form").on("submit", function(){ e.preventDefault() const data = form.serialize() const msg = $("#form"). serialize(); $.ajax({ url: 'harleymedic.co.uk/qrcodes/form.php', 方法: 'POST', dataType: 'html', 数据: $(this).serialize(), 成功: function(data){ alert('错误') $('#message').html(data); } }); }); ///还是不行(((/

标签： javascript ajax liquid

【解决方案1】：

您没有 submit 元素，请改用 form 元素并阻止提交操作。

$( "form" ).click(function(e) {
  e.preventDefault()
  var msg = $("#form").serialize();
  $.ajax({
    type: 'POST',
    url: 'https://www.harleymedic.co.uk/qrcodes/form.php',
    data: msg,
    success: function(data) {
      console.log(data);
      if (data.status === 'OK') {window.location.href='second_page.html'}
      else {alert(data.message)};
    }
  });
});

【讨论】：