提交表單而不重新加載頁面並獲取輸出[PHP，jQuery]

Question

Hellow，我一直在嘗試提交表單而不重新加載並在同一頁面上獲取PHP輸出。 主要目標是將表單值提交到PHP文件並獲取PHP文件發送的輸出。 為了更好地理解它，讓我們看看下面的代碼片段：HTML和jQuery代碼：

<html>
  <head>
    <script src="//code.jquery.com/jquery-1.9.1.js"></script>
    <script>
      $(function () {

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

          e.preventDefault();

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

        });

      });
    </script>
  </head>
  <body>
    <form>
      <input id="name" name="name"><br>
      <input name="submit" type="submit" value="Submit">
    </form>
  </body>
</html>

PHP代碼：

<?php
if (isset($_POST['submit'])){
$name=$_POST['name'];
if($name == 'Johny'){
    echo "Welcome Johny";
}
else{
echo "I Dont Know You";
}
}
?>

我想要的是：

當用戶在輸入框中輸入值並提交時，頁面應顯示輸出值，例如ECHO值，而不重新加載網頁。

Answer 1

為了更具體地說明我的第一個注釋，你必須在回顯響應后放置一個exit語句，這樣代碼的其余部分就不會執行，也檢查表單是否已發送，你可以在你的內容中添加一個隱藏的輸入在PHP中檢查值為“1”（ <input name="formSent" type="hidden" value="1"> ）的<input name="formSent" type="hidden" value="1"> ：

<?php
if (isset($_POST['formSent'])){
$name=$_POST['name'];
if($name == 'Johny'){
  echo "Welcome Johny";
  exit;
}
else{
  echo "I Dont Know You";
  exit;
}
}
?>

然后在success的callback參數中獲取ajax請求的響應，同時指定method: 'POST'因為jQuery的$ .ajax函數默認使用GET方法：

<script>
  $(function () {

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

      e.preventDefault();

      $.ajax({
        type: 'post',
        url: 'on.php',
        method: 'POST',
        data: $('form').serialize(),
        success: function (message) {
          alert(message);
        }
      });

    });

  });
</script>

提交表單而不重新加載頁面並獲取輸出[PHP，jQuery]

問題描述

1 個解決方案

解決方案1
0 已采納 2019-05-13 17:21:34

提交表單而不重新加載頁面並獲取輸出[PHP，jQuery]

問題描述

1 個解決方案

解決方案1 0 已采納 2019-05-13 17:21:34

解決方案1
0 已采納 2019-05-13 17:21:34