IT

ajaxの基礎「.get() .post() .load()」GETの使用を試してみた! -Part1

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をフォームに入れて送信を押すと、対応した名前が表示されます。

コメントを残す

*