ajax异步操作1
ajaxTest.html
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>ajaxTest.html</title>
<script type="text/javascript">
function loadXMLDoc(){
var xmlhttp;
if(window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}else{
xmlhttp = new ActiveXObject();
}
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState == "4" && xmlhttp.status == "200"){
document.getElementById("divShow").innerHTML=xmlhttp.responseText;
}
}
// xmlhttp.open("get","/testfile/ajaxTest.txt",true);//注意路径书写格式，直接在htdocs路径下的文件，前面要加/
// xmlhttp.send();
// xmlhttp.open("get","/testfile/test.php?c=2&t=5",true);
xmlhttp.open("GET","/testfile/test.php?c="+Math.random()*8+"&t="+Math.random()*19,true);
//注意两个参数连接时中间的&不能忘记了
xmlhttp.send();
}
function getInnerHtml(id){
if(id == "tr1"){
document.write(document.getElementById("tr1").innerHTML);
//注意innerHTML后面的html必须为大写,此方式不打印标签
}else{
alert(document.getElementById("tr2").innerHTML);
//注意innerHTML后面的html必须为大写，此方式会打印标签
}
}
function getInnerHtmlSwitch(id){
switch(id){
case 'tr1':
document.write(document.getElementById("tr1").innerHTML);
break;
case 'tr2':
alert(document.getElementById("tr2").innerHTML);
break;
default:
alert("No case!");
}
}
</script>
</head>
<body>
hello world!
你好，中国！<br/>
<button type="button" onclick="loadXMLDoc();">点击改变文件内容</button>
<div id="divShow"></div>
<button type="button" onclick="loadXMLDoc();">点击改变文件内容</button>
<div id="divShow"></div>
<table border="1">
<tr id="tr1">
<td>name1</td>
<td>age1</td>
<td>tel1</td>
<td> </td>
<td><input type = "button" onclick = getInnerHtml("tr1") value = "click it"/></td>
<!--此次onclick后面函数不能带双引号-->
<td><input type="button" onclick=getInnerHtmlSwitch("tr1") value="click on"></td>
</tr>
<tr id = "tr2">
<td>name2</td>
<td>age2</td>
<td>tel2</td>
<td>address2</td>
<td><input type = "button" onclick = getInnerHtml("tr2") value = "click it"/></td>
<td><input type="button" onclick=getInnerHtmlSwitch("tr2") value="click on"></td>
</tr>
<tr><td><input type="button" onclick=getInnerHtmlSwitch("tr3") value="click on"></td></tr>
</table>
</body>
</html>
test.php
<?php
function test($choice, $time){//要加$
if(intval($choice) < 1 || intval($time) < 1){
echo "The choice or time < 1.";
echo "<br>".intval($choice);
echo "<br>".intval($time);
return "<br>You can try again.";
}
switch($choice){
case '1':
echo "Your choice is one.";
break;
case '2':
echo "Your choice is two.";
break;
case '3':
echo "Your choice is three.";
break;
default:
echo "Your choice > 3.";
}
print("<br/>");
switch($time){
case '1':
echo "The time is one.";
break;
case '2':
echo "The time is two.";
break;
case '3':
echo "The time is three.";
break;
default:
echo "The time > 3.";
}
}
$choice = $_GET['c'];
$time = $_GET['t'];
$result=test($choice, $time);
echo $result;
?>本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读