我有一个成功执行xmlhttprequest的页面,但我希望Ajax格式的内容相同。
页面的作用是在选择框中使用3个不同的运算符计算两个值。
以下是代码:CalcServ.php
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0">
<title>Calculator</title>
<script type="text/javascript">
function calc()
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
val1 = document.getElementById("value1").value;
val2 = document.getElementById("value2").value;
mani = document.getElementById("manipulator").value;
if (val1 != "" && val2 != "")
{
document.getElementById("resp").innerHTML="Calculating...";
queryPath = "CalcServ.php?value1="+val1+"&value2="+val2+"&manipulator="+mani;
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("resp").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET",queryPath);
xmlhttp.send();
}
}
</script>
</head>
<body>
<div width="320">
<center>
<form>
<font size="4"><strong>PHP/AJAX Calculator</strong></font><br><br>
<input onkeypress="return onlyNumbers()" onkeyup="calc()" id="value1" type="text" name="value1"><br>
<select onchange="calc()" id="manipulator" name="manipulator">
<option value="add">SUM</option>
<option value="subtract">SUBTRACT</option>
<option value="multiply">MULTIPLY</option>
<option value="divide">DIVIDE</option>
</select><br>
<input id="value2" onkeyup="calc()" type="text" name="value2">
</form>
<strong><font size="4" color="blue"><span id="resp" title="This is generated via an AJAX/PHP call"></span></font></strong>
<br>
<br>
</center>
</div>
</body></html>
感谢您的光临。