PHP はフォーム送信を実装しますが、ジャンプしません

Web開発において、フォーム(Form)は非常に重要な要素です。ユーザーはフォームを通じてサーバーにデータを送信できます。多くのアプリケーションでは、送信後にフォームが別のページにジャンプするため、送信結果が適切に表示されますが、ジャンプせずにフォームを送信する必要がある場合もあります。この記事では、ジャンプせずに PHP フォーム送信を実装する方法を紹介します。

1. AJAX を使用してフォームを送信する

AJAX は、Asynchronous JavaScript and XML の略称で、ブラウザーがサーバーに非同期でリクエストを送信し、応答を受信できるようにします。 AJAX テクノロジーを使用すると、ページを更新せずにフォームを送信し、サーバーから返されたデータをページ上に動的に表示できます。

次は、ユーザー名とパスワードの入力ボックスと送信ボタンを含むフォームの HTML コードです:

<form id="login-form" method="post" action="">
  <label for="username">用户名：</label>
  <input type="text" id="username" name="username">
  
  <label for="password">密码：</label>
  <input type="password" id="password" name="password">
  
  <button type="submit" id="submit-btn">提交</button>
</form>

次に、JavaScript コードを使用して、次の送信イベントをキャプチャする必要があります。フォームを作成し、AJAX テクノロジを使用してフォーム データをサーバーに送信します。この場合、コードを簡素化するために jQuery ライブラリを使用しています。

$(document).ready(function() {
  $('#login-form').submit(function(event) {
    // 阻止表单默认提交行为
    event.preventDefault();
  
    // 通过AJAX提交表单数据
    $.ajax({
      type: 'POST',
      url: 'login.php',
      data: $('#login-form').serialize(),
      success: function(data) {
        // 处理服务器返回的数据
        alert('登录成功！');
      }
    });
  });
});

上記のコードでは、まずフォームのデフォルトの送信動作を防止する必要があります。次に、$.ajax() メソッドを使用して、フォーム データをサーバーに送信します。 $.ajax() このメソッドは、リクエスト タイプ、URL、データ、コールバック関数などの情報を含む JavaScript オブジェクトをパラメータとして受け取ります。

2. 非表示の iframe を使用してフォームを送信する

AJAX テクノロジーの使用に加えて、非表示の iframe テクノロジーを使用してフォームを送信し、サーバーから返された結果を同じサーバー上に表示することもできます。ページ。

次は、ユーザー名とパスワードの入力ボックスと送信ボタンを含むフォームの HTML コードです:

<form id="login-form" method="post" action="login.php" target="login-iframe">
  <label for="username">用户名：</label>
  <input type="text" id="username" name="username">
  
  <label for="password">密码：</label>
  <input type="password" id="password" name="password">
  
  <button type="submit" id="submit-btn">提交</button>
</form>

<iframe name="login-iframe" id="login-iframe" style="display:none;"></iframe>

フォームでは、ターゲットを「login-iframe」として設定します。 iframe 要素を非表示にし、フォームの target 属性を iframe の名前に設定します。ユーザーがフォームを送信すると、フォーム データは指定された URL に送信され、その iframe 内で処理されます。

次に、JavaScript コードを使用してフォームの送信イベントをキャプチャし、非表示の iframe にリダイレクトする必要があります。

$(document).ready(function() {
  $('#login-form').submit(function() {
    // 将表单的action属性替换掉iframe的src属性
    $('#login-iframe').attr('src', $('#login-form').attr('action'));
    return false;
  });
});

function loginSuccess() {
  // 处理服务器返回的数据
  alert('登录成功！');
}

上記のコードでは、フォームの action 属性を非表示の iframe の src 属性に置き換えて、フォーム データをサーバーに送信します。フォームの送信は iframe で行うことができるので、サーバーからデータを返して iframe に表示することができます。返されたデータでは、JavaScript を介して loginSuccess() 関数を呼び出して、サーバーから返されたデータを処理できます。

まとめ

上記では、PHP フォーム送信をジャンプせずに実装する 2 つの方法を紹介しました。このうち、AJAX テクノロジーを使用して実装する方法は、より便利で拡張が容易ですが、一定の JavaScript スキルが必要です。 。非表示の iframe テクノロジを使用してフォームを送信する方が簡単ですが、セキュリティ上のリスクがある可能性があるため、使用には注意が必要です。

実際の開発では、ニーズに応じて自分に合った方法を選択できます。どの方法を使用する場合でも、アプリケーションのセキュリティを確保するために、フォーム データの厳密な検証とフィルタリングを推奨します。

以上がPHP はフォーム送信を実装しますが、ジャンプしませんの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。