段落のドロップダウンから選択した都市の完全な名前を表示しようとしています。しかし、jQuery ajax 呼び出しでは出力が得られません。
index.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Learn Javascript</title>
<script src="jquery-1.10.2.min.js"></script>
</head>
<body>
<select id="states">
<option> LDH </option>
<option> JLD </option>
<option> CHD </option>
</select>
<br/>
<p>The Full name is: <span id="fullname"></span></p>
<script>
$(document).ready(function() {
$('#states').change(function() {
selectedState = $('#states option:selected').text();
$.get('learn.php?state='+selectedState, function(data) {
$('#fullname').html(data);
});
});
});
</script>
</body>
</html>
Learn.php
<?php
switch ($_GET['state']) {
case 'LDH' :
echo 'Ludhiana';
break;
case 'JLD' :
echo 'Jalandhar';
break;
case 'CHD' :
echo 'Chandigarh';
break;
}
?>
ドロップダウンの状態が変更されると、php ファイルからデータを取得して、選択した都市の完全な名前を出力することになっています。