AJAX没有'；t传输数据 - AJAX doesn't transfer data

我想将数据从一个页面传输到另一个页面。我得到了两个页面：hostSettings.php和test.php

好的，这是我的test.php它包括一个提交按钮和ajax/jquery脚本

<html>
  <head>
    <link href="CSS/style.css" type="text/css" rel="stylesheet" />
    <script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
    <script>
      $(document).ready(function() {
        $('#button').on('submit', function(e) {
          e.preventDefault();
          var test = "Hallo Welt!";
          $.ajax({
            url: "hostSettings.php",
            type: "POST", 
            data: { test : test },
            success: function (response) {
              console.log("data transmitted: " + response);
            },
            error: function(jqXHR, textStatus, errorThrown) {
              alert("Es ist ein Fehler aufgetreten!'n" + textStatus + "'n" + errorThrown);
              console.log(textStatus, errorThrown);
            }
          }); 
        });
      });
    </script>
  </head>
  <body>
    <font size="4">Test-Site</font>
    <hr>
    <?php include ("menu.html");?><br><br>
    <form method="POST" action="hostSettings.php">
      <input id="button" value="TEST" type="submit">
    </form>
  </body>
</html>

hostSettings.pp:

    <html>
  <head>
    <link href="CSS/style.css" type="text/css" rel="stylesheet" />
    <script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
  </head>
  <body>
    <font size="4">Hosts speichern</font><hr>
    <?php include ("menu.html");?><br><br>
    <br><br><br>
    <p><center>
      <h3>Diese Seite befindet sich momentan im Aufbau..</h3>
      <form action="index.php">
        <input type="submit" value="Zurück zum Index">
      </form>
    </p></center>
    <?php
      if( $_SERVER['REQUEST_METHOD']=='POST' ){
        if(isset($_POST["test"])) {
          echo $_POST["test"];
       }
      }
    ?>
  </body>
</html>

为什么它不将数据从test.php传输到hostSettings.php：（

submit事件不是为提交按钮设计的。

你需要在表格上开火。

您可以在form的submit或button的click上触发事件。

更改此项：

$('#button').on('submit', function(e) {

收件人：

$('#button').on('click', function(e) {

和

<input type="submit" value="Zurück zum Index">

收件人：

<input type="button" value="Zurück zum Index">

您正在对按钮进行提交时，提交时应该在表单上。在表单中输入一个id，然后输入相同的代码，正如Fred所说，使用按钮标记。如果你想使用这个按钮，你也可以试着打开（"点击"），它看起来也会简单得多。

例1。用id 标记表单

 $(document).ready(function() {
        $('#myForm').on('submit', function(e) {
          e.preventDefault();
          var test = "Hallo Welt!";
          $.ajax({
            url: "hostSettings.php",
            type: "POST", 
            data: { test : test },
            success: function (response) {
              console.log("data transmitted: " + response);
            },
            error: function(jqXHR, textStatus, errorThrown) {
              alert("Es ist ein Fehler aufgetreten!'n" + textStatus + "'n" + errorThrown);
              console.log(textStatus, errorThrown);
            }
          }); 
        });
      });

示例2:

$(document).ready(function() {
        $('#button').on('click', function(e) {
          e.preventDefault();
          var test = "Hallo Welt!";
          $.ajax({
            url: "hostSettings.php",
            type: "POST", 
            data: { test : test },
            success: function (response) {
              console.log("data transmitted: " + response);
            },
            error: function(jqXHR, textStatus, errorThrown) {
              alert("Es ist ein Fehler aufgetreten!'n" + textStatus + "'n" + errorThrown);
              console.log(textStatus, errorThrown);
            }
          }); 
        });
      });