javascript - 尽管使用了 e.preventDefault() ，但仍会加载表单；

Question

我正在制作一个 ajax 表单，但问题是尽管使用了e.preventDefault(). 我用谷歌搜索了很多，找到了最多的答案，但仍然没有工作。

$(document).ready(function() {
  $("#upload").on('submit', function(e) {
    e.preventDefault();
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="upload" method="post" enctype="multipart/form-data">
  <div class="form-group">
    <label class="control-label" for="input-email">Product Name</label>
    <input type="text" name="ProductNamees" value="" placeholder="Enter Product Name" id="Product" class="form-control">
  </div>

  <div class="form-group">
    <label class="control-label" for="input-email">Category</label>
    <select name="category" name="category" value="" id="category" class="form-control">
      <option value="0">Category</option>
      <option value="1">Flower Bouquet (Buke)</option>
      <option value="2">Flower Garland (Har)</option>
      <option value="3">Stage Decoration</option>
      <option value="4">Bed Decoration</option>
      <option value="5">Car Decoration</option>
      <option value="6">Home Decoration</option>
      <option value="7">Palna Decoration</option>
    </select>
  </div>
  <div class="form-group">
    <label class="control-label" for="input-email">file upload</label>
    <input type="file" name="files" value="" placeholder="" id="file" class="form-control">
  </div>
  <div class="form-group">
    <label class="control-label" for="input-email">price</label>
    <input type="text" name="price" value="" placeholder="Enter price" id="price" class="form-control">
  </div>
  <input type="submit" id="uploadsdfkf" name="upload" value="upload" class="btn check btn-primary">
</form>

标签： javascriptjquery