Javascript 使用Ajax在提交表单时保持在同一页面不起作用

我正在尝试创建一个表单，当您提交表单时，您将停留在同一页面上，并将用户输入发送到Process.php和我的数据库。我面临的问题是，页面要么刷新，要么打开page Process.php

我的表格

<form action="process.php" method="post" class="copy" id="formid" enctype="multipart/form-data">

    Project name: <input type="text" name="name"> <br>


        Video: 
        <input type="text" rows="1" cols="40" name="video">
    <br> 
    Svar 1<input type="text" name="answer1"/> 
    <select name="point1">
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
      <option value="6">6</option>
      <option value="7">7</option>
      <option value="8">8</option>
      <option value="9">9</option>
      <option value="10">10</option>
    </select>
    <br>
    Svar 2<input type="text" name="answer2"/> 
    <select name="point2">
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
      <option value="6">6</option>
      <option value="7">7</option>
      <option value="8">8</option>
      <option value="9">9</option>
      <option value="10">10</option>
    </select>
    <br>
    Svar 3<input type="text" name="answer3"/> 
    <select name="point3">
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
      <option value="6">6</option>
      <option value="7">7</option>
      <option value="8">8</option>
      <option value="9">9</option>
      <option value="10">10</option>
    </select>
    <br>
    Svar 4<input type="text" name="answer4"/> 
    <select name="point4">
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
      <option value="6">6</option>
      <option value="7">7</option>
      <option value="8">8</option>
      <option value="9">9</option>
      <option value="10">10</option>
    </select>
    <br>



       <br>
    <input type="submit" name="submit" value="create question" id="submit">
    </form>

---

也许你对你的表格采取了行动。如果您向表单提供操作，它将打开您在操作中指定的页面。如果您给出了

请尝试删除表单的action属性，并在ajax成功后而不是在启动ajax之前尝试阻止默认值

$(function () {

    $('form').on('submit', function (e) {

      $.ajax({
        type: 'post',
        url: 'process.php',
        data: $('form').serialize(),
        success: function () {
          alert('form was submitted');
          e.preventDefault();
        }
      });

    });

  });   

---

也许这会解决这个问题（答案抄袭自@HarveyARamer，并将分数记入@HarveyARamer）：

我最好的猜测是您正在添加

表单

提交侦听器 在实际呈现窗体之前。尝试将jQuery包装到

$（文档）.ready（函数（）{}）

Html

使用类型作为按钮，而不是提交

<input type="button" name="submit" value="create question" id="submit">

---

你的html中有表单吗？顺便说一句，你有很多危险的查询导致痛苦的sql注入。你收到警告消息了吗？@JulioSoares检查我的编辑，在“我的表单”部分action=“process.php”的what is required下有一个表单，你是在ajax中执行的，所以请删除它。

$(function () {

    $('form').on('submit', function (e) {

      $.ajax({
        type: 'post',
        url: 'process.php',
        data: $('form').serialize(),
        success: function () {
          alert('form was submitted');
          e.preventDefault();
        }
      });

    });

  });   

<input type="button" name="submit" value="create question" id="submit">

$('#submit').click(function(e){

     e.preventDefault();

          $.ajax({
            type: 'post',
            url: 'process.php',
            data: $('form').serialize(),
            success: function () {
              alert('form was submitted');
            }
          });

        });