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

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

Barbara Streisand
リリース: 2024-12-19 14:20:16
オリジナル
192 人が閲覧しました

How to Use AJAX to Call PHP Functions on Button Clicks?

AJAX を利用してボタンのクリック時に PHP 関数をトリガーする方法

このシナリオでは、ボタンのクリック時に PHP 関数を実行しようとしています。 「functioncalling.php」ページにあります。ただし、レンダリングされる出力で問題が発生します。これは、HTML フォームの送信を通じて PHP 関数を直接呼び出すことができないためです。ギャップを埋めるには、Ajax を採用する必要があります。

HTML マークアップと jQuery コードの改訂

HTML マークアップを次のように更新します:

<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");
    });
  });
});
ログイン後にコピー

「ajax.php」ファイル

次のコードを使用して「ajax.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;
    }
?>
ログイン後にコピー

AJAX を理解するメカニズム

ユーザーがいずれかのボタンをクリックすると、jQuery コードが「ajax.php」への AJAX リクエストをトリガーします。 「action」パラメータには、クリックされたボタンの値(「挿入」または「選択」)が含まれます。 「.post()」メソッドはこのデータを「ajax.php」に送信し、「action」値に基づいて対応する PHP 関数を実行します。 PHP 関数の出力はキャプチャされ、応答 div に適切に表示されます。

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

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