◆前書き
業務で全く経験したことのないAjaxをお願いされて勉強を始めました。
◆実現したいこと
このサイトのように
1と打てば→「田中」
2と打てば→「佐藤」
と出るようにしたい。
◆現状
1、2は打てるが送信を押してもレスポンスがなく返却値もない。
ディレクトリ構造も同じ階層に
index.html、sample.phpファイルを置いているので問題ないかと思います。
本日より学習を始めたのですが、環境?なのかエラーログを吐くわけでもないので何卒お力添えいただけたらと思います。
以上、よろしくお願いいたします。
◆追記
Fiddler を入手して、要求・応答をキャプチャして・・・
⇒入手いたしました。
送信ボタンを押しているのですが、Fiddler上何も表示されないのでおそらく叩けていないのだなと思いました。
タグにphpも設定しておいた方が・・・
⇒ご指摘ありがとうございます。追加いたしました。
あなた自身が書かれているコード・・・
⇒記載いたしました。参考にしているサイトと同じコードになります。
◆コード
同じディレクトリ配下に、
・index.html
・sample.php
▼index.html
HTML
1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="utf-8"> 5 <title>ajax</title> 6</head> 7<body> 8<h1>jquery.get()</h1> 9 10<label>ID:<input type="number" name="name" value=""></label> 11<input type="button" value="送信"> 12<p>名前:<span></span></p> 13 14<script src="//code.jquery.com/jquery-3.1.1.min.js"></script> 15<script> 16$(function() { 17 18 $("[type=button]").on("click", function() { 19 20 $.get("sample.php", { 21 id : $("[type=number]").val() 22 }, function(data) { 23 $("span").text(data); 24 }); 25 26 }); 27 28}); 29</script> 30</body> 31</html>
▼sample.php
php
1<?php 2switch ($_GET['id']) { 3 case 1: 4 echo "田中"; 5 break; 6 case 2: 7 echo "佐藤"; 8 break; 9 default: 10 echo "なし"; 11 break; 12}
◆phpの環境が自分のPCに無かったので・・
このサイトを参考にphpの環境を作りました。