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

お問い合わせフォーム

気になる方はコチラからお問い合わせ!
必須お名前
必須メールアドレス
必須郵便番号
必須ご住所
必須電話番号
ご相談内容
必須メッセージ本文

コメントを残す

*