JavaScriptの変数をPHPに渡す方法

JavaScriptの変数を直接PHPに渡すことはできないので、cookieやHTML5のWeb Storageを経由して渡す。
または、JavaScriptのXMLHttpRequest、jQueryの$.ajaxなどを使用して外部PHPプログラムに渡します。

vanilla.jsの例

// XMLHttpRequestオブジェクト生成
var xhr = new XMLHttpRequest();
// 通信状態が変化したタイミングで実行
xhr.onreadystatechange = function() {
	// HTTPの通信状態を取得
	switch (xhr.readyState){
		// 未初期化
		case 0:
		break;
		// ロード中
		case 1:
		break;
		// ロード済
		case 2:
		break;
		// 一部の応答を取得
		case 3:
		break;
		// すべての応答を取得済
		case 4:
			// HTTPステータスコードを取得して処理を分岐
			if (xhr.status === 200 || xhr.status==304) {
				var data = xhr.responseText;
			}
			else {
				console.log(xhr.statusText);
			}
		break;
	}
}
// HTTPリクエストを初期化 open(HTTPメソッド, URL(相対パス), 非同期で通信するか, 認証ユーザ名, 認証パスワード)
xhr.open('GET', [file_path], true);
// HTTPリクエストを送信 send( 送信データ(変数とか文字列など) )
xhr.send(null);

jQueryの例

書き方1

$.ajax({
	type: 'POST',
	url: 'test.php',
	data: "name1=value1&name2=value2",
	success: function(data) {
		alert(data);
	}
});

書き方2

$.ajax({
  type: 'POST',
  url: 'test.php',
  data: {
    'name1' : value1,
    'name2' : value2
  },
  success: function(data) {
  	alert(data);
  }
});

「type」でメソッドを指定
「url」で実行するphpファイルを指定
「data」で実行するphpファイルに渡す引数を指定(php側で$_POST['name1']で取得できる)
「success」はphpファイルで出力した値が入る(dataに値が入る)

JavaScriptの変数をPHPに渡す方法

vanilla.jsの例

jQueryの例

参考サイト