ajax异步操作1
时间:2022-05-06
本文章向大家介绍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;
?>
- 双拼域名yansuan.com被木雨林收购
- open-falcon ---安装Dashboard时候报错"SSLError: The read operation timed out"
- Flash/Flex学习笔记(37):不用系统组件(纯AS3)的视频播放器--只有8.82K
- Flash/Flex学习笔记(35):如何正确监听Stage对象的事件
- Flash/Flex学习笔记(34):AS3中的自定义事件
- 字符串处理总结(旧)
- 计算某年某月的某一天是星期几的算法
- Flash/Flex学习笔记(33):如何用As3协同Flash CS IDE控制MovieClip实例
- live writer的折腾
- 用C语言写的万年历---亲手写的。好累哦
- Flash/Flex学习笔记(32):播放音乐并同步显示lyc歌词(适用于Silverlight)
- Flash/Flex学习笔记(31):对象拖拽与投掷
- 如何评价张小龙在2016微信公开课的演讲
- VS2010如何做WAP开发
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- Python 用smtplib库发邮件报错:[WinError 10061] 由于目标计算机积极拒绝,无法连接。解决办法
- python运算符
- Windows 技术篇-禁用windows更新服务,解决windows无法关闭更新问题,解决windows自己启用更新问题。
- 搭建 SkyWalking 服务(For ElasticSearch 7)
- 基于 SkyWalking 实现服务链路追踪
- Python 技巧篇-字符串灵活处理:字符串过滤、字符串拼接,字符串切片,特殊、超长字符串的处理实例演示
- Python 技巧篇-开头注释怎么写最好,开头注释需要包含什么,开头注释的重要性
- 在CentOS8下安装Python3和ansible
- 开发一个属于自己的Spring Boot Starter
- 如何让Tomcat使用APR连接器
- VueJS中使用前端虚拟接口Mock.js
- CentOS7下源码安装MySQL 8.x
- 最新!中国天气网api接口调用,key获取方式,数据请求秘钥获取,城市id获取方法
- Jmeter接口压测快速入门
- 超简单!Qt Designer插入图片,styleSheet加入图片,Qt加入背景图片