文章提供一款简单asp教程 ajax 实例（post,get,form测试)哦，他做了三个相关ajax asp测试实例，都通过了。
index.html
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.111cn.net/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns="http://www.111cn.net/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<title>艾恩ajax类</title>
<link type="text/css教程" rel="stylesheet" href="css.css" />
<script language="网页特效" type="text/javascript" src="jo.ajax.js"></script>
<script language="javascript" type="text/javascript">
/*测试ajax功能(类似jquery的ajax,功能没它的强大,但使用更方便),自动防止缓存*/
function testajax(){
document.getelementbyid("ajaxresult").innerhtml="<img src="loading.gif" alt="" /> 请求数据中...";
ajax({
asc:true,
url:"test_ajax.asp?get=" + "我的id是anlige".utf8(),
data:"post=tandy",
method:"post",
datatype:"json",
succeed:function(msg,obj,setting){
var str="";
str=str+"请求的url: " + setting.url + "<br />";
str=str+"请求的方式: " + setting.method + "<br />";
str=str+"请求的数据: " + setting.data + "<br /><br />";
str=str+"返回的文本: " + obj.responsetext + "<br /><br />";
str+="json数据:<br />";
str+="我的id是: " + msg.id + "<br />";
str+="我的名字是: " + msg.name + "<br />";
document.getelementbyid("ajaxresult").innerhtml=str;
}
});
return true;
}function servervariables(variable){
document.getelementbyid("variresult").innerhtml="<img src="loading.gif" alt="" /> 变量读取中...";
ajax({
url:"test_ajax_time.asp",
method:"get",
datatype:"text",
data:"v=" + variable,
succeed:function(msg){
document.getelementbyid("variresult").innerhtml=variable + " = " + msg;
}
});
}function postfrom(obj){
ajax({
form:obj,
datatype:"text",
succeed:function(msg,o,s){
document.getelementbyid("formajaxresult").innerhtml=msg;
},
error:function(s){alert(s);}
});
}function testget(){
ajax.get("test_ajax_time.asp","v=url",function(msg){alert(msg);});
}function testpost(){
ajax.post("test_ajax.asp","post=tandy",function(msg){alert(msg);});
}</script>
</head>
<body>
<p><span style="font-size: 12pt"><strong>艾恩ajax类</strong></span></p>
<hr />
<h5>测试1-获取服务器变量，使用get方式</h5>
获取服务器变量 : <input type="text" id="vari" size="30" value="remote_addr" onblur="return servervariables(this.value);" /> 文本框失去焦点，自动调用<br />
<div id="variresult"></div>
<div class="info">您可以输入其他相关变量进行测试,例如http_referer,url,server_name</div><br />
<hr />
<h5>测试2-提交相对复杂数据，返回json数据，使用post方式</h5>
<input type="button" value="获取json数据" onclick="return testajax();" style="font-size: 9pt" />
<div id="ajaxresult" style="font-size: 9pt"></div><hr />
<h5>测试3-ajax提交form</h5>
<form action="test_post_form.asp?myname=anlige" method="post">
文本框：<span><input type="text" name="text1" value="测试test" style="border:1px #ddd solid;" /></span><br />
复选框1：<input type="checkbox" name="check1" value="" style="border:0px" /><br />
复选框2：<input type="checkbox" name="check2" value="the value of check2" style="border:0px" /><br />
单选框：<input type="radio" name="radio" value="value1" style="border:0px" />选项1 <input type="radio" name="radio" value="value2" style="border:0px" />选项2<br />
下拉列表：<select name="select1">
<option value="test1">测试1</option>
<option value="test2">测试2</option>
</select>
<input type="submit" value="提交" onclick="postfrom(this.form);" />
</form>
<div id="formajaxresult" style="font-size: 9pt"></div>
<hr />
<h5>测试4-ajax的简洁调用-get和post方法（统一使用异步获取文本的方式）</h5>
<input type="button" value="测试ajax.get" onclick="testget();" />
<input type="button" value="测试ajax.post" onclick="testpost();" />
<!--
ajax类库使用说明
-->
<h5>ajax类库使用说明</h5>
<p>
<span>
完整调用统一调用入口：<span style="color: #ff0000">ajax(setting);</span> 关于参数setting,请详细参考下面的说明。<br /><br />
简洁调用入口：<span style="color: #ff0000">ajax.get(url,data,fn);</span> 以及 <span style="color: #ff0000">ajax.post(url,data,fn);</span><br /><br />
ajax的配置:<br />
<span style="color: #0000ff">
var</span> settings = {
<br />
<span style="color: #ff0000"> asc</span>: <span style="color: #0000ff">
true</span>, <span style="color: #006600">//true-异步传输；false-同步传输</span>
<br />
<span style="color: #ff0000"> form</span>: <span style="color: #0000ff">
formobj</span>, <span style="color: #006600">//表单对象,如果设置本项，则会用ajax提交表单，忽略设置的method,url和data属性</span>
<br />
<span style="color: #ff0000">url</span>: <span style="color: #660033">
""</span>, <span style="color: #006600">//若不设置form属性，则本项为必选值</span><br />
<span style="color: #ff0000">datatype</span>: <span style="color: #660033">
"text"</span>, <span style="color: #33cc00"> <span style="color: #006600">//可取值text,xml,json</span></span><br />
</span></span> <span style="color: #ff0000">method</span>: <span style="color: #660033">
"get"</span>, <span style="color: #006600">//可取post,get 不区分大小写。设置form属性后，本项会被忽略。</span>
<br />
<span style="color: #ff0000">data</span>: <span style="color: #660033">
""</span>, <span style="color: #006600">//具体格式请看示例程序。设置form属性后，本项会被忽略。</span><br />
<span style="color: #ff0000">timeout</span>: <span style="color: #660033">
10000</span>, <span style="color: #006600">//设置超时时间，默认为10秒（即10000毫秒）</span><br />
<span style="color: #ff0000">succeed</span>: <span style="color: #0000ff">
function</span>(a,b,c){<span style="color: #0000ff">return true</span>},
<br />
<span style="color: #ff0000">error</span>: <span style="color: #0000ff">
function</span>(a,b,c){<span style="color: #0000ff">return true</span>},
<br />
<span style="color: #ff0000">ontimeout</span>: <span style="color: #0000ff">
function</span>(a,b,c){<span style="color: #0000ff">return true</span>}
<br />
};<br />
</span>
</p>
</body>
</html>
首页 1 2 3 末页