イベントで、ajaxを介してテキストボックスの値を計算しようとしていますonkeyup
:
index.php
<html>
<head>
<script type="text/javascript">
function calc() {
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
} else {
xmlhttp = new ActiveXObject('MicrosoftXMLHTTP');
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById('myDiv').innerHTML = xmlhttp.responseText;
}
}
var text = document.getElementById('txtField').value;
var target = "calc.php";
var parameter = "txtValue=" + text;
xmlhttp.open('POST', target, true);
xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xmlhttp.send(parameter);
}
</script>
</head>
<body>
Price: <input type="text" id="txtField" onkeyup="calc();">
<div id="myDiv"></div>
</body>
</html>
calc.php
if ($_POST['txtValue'] && !empty($_POST['txtValue'] )) {
echo $_POST['txtValue'] * 4;
}
しかし、結果は表示されません。ここで何が欠けているのか教えてください。