jQueryのajaxについて調べてみました。
ajaxの基礎関数について(.get() .post() .load()）これらがあるようで、まずはgetを使って試してみました。
<script src=”//code.jquery.com/jquery-3.1.1.min.js”></script>
<head>でjqueryを呼び出します！
————————————————
GETを使用したサンプル
<label>ID：<input type="text" name="name" value=""></label> <input type="button" value="送信">
<p style="font-size:11px;">入力したID(数字)の名前が表示されます</p>
<p>名前：<span></span></p>
<script>
$(function() {
$("[type=button]").on("click", function() {
$.get("sample.php", { //phpファイルの読み込み
id : $("[type=text]").val()
}, function(data) {
$("span").text(data);
});
});
});
</script>
<?php
switch ($_GET['id']) {
case 1:
echo "山田";
break;
default:
echo "松田";
break;
}
phpファイル側で定義されているIDをフォームに入れて送信を押すと、対応した名前が表示されます。
コメント