【JavaScript】jQueryのAjaxでphpにデータを渡す方法

今回は、JavaScriptの小ネタです。
jQueryのAjaxでphpにデータを渡す方法をご紹介します。

jQueryとは？Ajaxとは？

jQueryとは、JavaScriptのライブラリで、使用することでJavaScriptをシンプルに記述することができます。
少し前までは、jQueryを使用すると速度が遅くなってしまうこともありましたが、最近では特に気にする必要はありません。

Ajaxとは、Asynchronous JavaScrip and XMLの頭文字をとって、エイジャックスと読みます。
非同期通信を利用して、ページの一部を動的に書き換えることができます。

Ajaxでphpにデータを渡す

まず、空のjsファイルを用意し、下記を記述します。

$(function () {
    var param = 'りんご'; // 渡したいデータ

    $.ajax({
        type: 'POST',
        url: '/assets/index.php', // phpファイルの場所
        data: {'parameter': param},
        success: function (data) {
            console.log(data); // データ受け渡し成功したときにしたい処理
        },
        error: function (err) {
            console.log("データ受け渡し失敗");
        }
    });
});

次に、空のphpファイルを用意し、下記を記述します。

<?php
$parameter = $_POST['parameter']; //jsからのデータを受け取り、変数に代入
print $parameter;

こうすることで、jsとphp間でデータの受け渡しができます。

ページのURLや要素を、jsでしか取得できない場合に便利です。

最後に

以上、jQueryのAjaxでphpにデータを渡す方法をご紹介しました。

他にも小ネタが思いついたら書きます。