找不到Jquery AJAX 404 form.php

时间:2018-07-15 19:30:24

标签: javascript php jquery

我正在尝试使用Jquery和PHP连接一个简单的HTML表单。但是,我遇到以下错误:

jquery.min.js:2 POST http://127.0.0.1:8887/form.php 404 (Not Found)

script.js

$("#form").submit(function (e) {
    e.preventDefault();
  }).validate({
    rules: {
      name: {
        required: true,
      },
      email: {
        required: true,
        email: true
      },
      subject: {
        required: true,
      },
      message: {
        required: true,
      },
    },
    submitHandler: function () {
      // alert("enter");
      var form = $('#form');
      var formData = $(form).serialize();
      $.ajax({
        type: 'POST',
        url: '../form.php',
        data: formData
      }).done(function (response) {
        // Clear the form.
        $('#name').val('');
        $('#email').val('');
        $('#message').val('');
      });

      return false;  //This doesn't prevent the form from submitting.
    }
  });

目录结构:

16/07/2018  03:22 AM    <DIR>          .
16/07/2018  03:22 AM    <DIR>          ..
23/06/2018  05:48 PM    <DIR>          .git
14/05/2018  03:37 PM                11 .gitignore
21/06/2018  03:00 PM    <DIR>          .sass-cache
14/05/2018  03:09 PM    <DIR>          .vscode
21/06/2018  03:00 PM    <DIR>          bulma
14/05/2018  03:09 PM    <DIR>          content
14/05/2018  03:09 PM    <DIR>          css
16/07/2018  03:22 AM                66 form.php
15/07/2018  06:57 PM    <DIR>          img
16/07/2018  03:03 AM            31,166 index.html
12/05/2018  07:55 PM                45 index.php
15/07/2018  06:57 PM    <DIR>          js
16/07/2018  03:22 AM    <DIR>          php
27/05/2018  12:16 PM               378 README.md

js文件夹由script.js文件组成,该文件在目录中要求form.php。如何正确将ajax脚本指向正确的php文件?如果有帮助,我正在使用Chrome Webserver插件来模拟Web服务器,因为Chrome不允许php脚本将index.html作为文件打开。

1 个答案:

答案 0 :(得分:1)

Chrome Web服务器似乎有问题,我不确定它是否可以处理php文件并提供服务。

尝试使用内置在服务器中的php服务器来服务form.php:

在目录结构内部执行:

php -S localhost:80 

然后,从您的jquery脚本中更改URL:

  submitHandler: function () {
      // alert("enter");
      var form = $('#form');
      var formData = $(form).serialize();
      $.ajax({
        type: 'POST',
        url: 'http://localhost/form.php',
        data: formData
      }).done(function (response) {
        // Clear the form.
        $('#name').val('');
        $('#email').val('');
        $('#message').val('');
      });

      return false;  //This doesn't prevent the form from submitting.
    }