ホームページ > バックエンド開発 > PHPチュートリアル > AJAX を使用してボタンのクリックで PHP 関数を実行するにはどうすればよいですか?

AJAX を使用してボタンのクリックで PHP 関数を実行するにはどうすればよいですか?

Mary-Kate Olsen
リリース: 2024-12-04 21:00:16
オリジナル
856 人が閲覧しました

How Can I Execute PHP Functions with Button Clicks Using AJAX?

ボタンのクリックで PHP 関数を実行

特定の関数を呼び出すための 2 つのボタンを備えた PHP ページを作成しましたが、まだ作成されていません。期待される出力が得られます。問題は、使用しているアプローチにあります。

ボタンがクリックされたときに PHP 関数を正しく実行するには、ページとサーバー間の非同期通信に Ajax を利用する必要があります。 Ajax を組み込んだコードの修正版は次のとおりです:

修正済みマークアップ:

<input type="submit" class="button" name="insert" value="insert" />
<input type="submit" class="button" name="select" value="select" />
ログイン後にコピー

jQuery:

$(document).ready(function() {
    $('.button').click(function() {
        var clickBtnValue = $(this).val();
        var ajaxurl = 'ajax.php',
        data = {'action': clickBtnValue};
        $.post(ajaxurl, data, function(response) {
            // Response div goes here.
            alert("action performed successfully");
        });
    });
});
ログイン後にコピー

aja x.php:

<?php
    if (isset($_POST['action'])) {
        switch ($_POST['action']) {
            case 'insert':
                insert();
                break;
            case 'select':
                select();
                break;
        }
    }

    function select() {
        echo "The select function is called.";
        exit;
    }

    function insert() {
        echo "The insert function is called.";
        exit;
    }
?>
ログイン後にコピー

説明:

  • click() イベントは、ボタンのクリックをキャプチャするために使用されます。
  • ボタンがクリックされると、対応する関数名が Ajax リクエストのアクション値として渡されます。
  • ajax.php スクリプト、これには関数定義が含まれており、$.post() を使用して非同期的に呼び出されます。
  • サーバー側スクリプトが関数を実行した後、応答が受信され、警告メッセージが表示されます。
  • exit ステートメントは、関数呼び出し後にサーバー側スクリプトがさらにコードを実行するのを防ぎ、応答が複数回送信されないようにします。

Withこの方法では、[挿入] または [選択] ボタンをクリックすると、対応する関数が実行され、実行が成功したことを示す警告メッセージが表示されます。

以上がAJAX を使用してボタンのクリックで PHP 関数を実行するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート