test1.html
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=UTF-8">
<title>Ajax Test 1</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$('#sendButton').click(function(event) {
$.post(
"test1.php",
{ sendValue: $('#a').val() },
function(data, textStatus) {
if (textStatus == 'success') {
$('#textStatus').text('Success');
}
$("#result").html(data);
}, 'html')
.fail(function() {
$("#result").html("Failed");
}
);
});
});
</script>
</head>
<body>
入力欄に文字列を入れると、POST されて応答が返ってきます<br/>
<input type="text" name="a" value="" id="a"/><br/>
<button type="button" id="sendButton">送信</button><br/><br/>
textStatus: <span id="textStatus"></span><br/>
Result: <span id="result"></span>
</body>
</html>
test1.php
<?php
/* print("called test1.php<br/>"); */
$val = htmlspecialchars($_POST['sendValue']);
/* print($val); */
// jQuery が送信するヘッダーをチェック
if (isset($_SERVER['HTTP_X_REQUESTED_WITH']) &&
($_SERVER['HTTP_X_REQUESTED_WITH'] === 'XMLHttpRequest') &&
(isset($_POST['sendValue']))) {
print("Hello, " . $val);
}
else {
print('');
}
?>
0 件のコメント:
コメントを投稿