【www.gdgbn.com--网络相关】

文章提供一款简单asp教程 ajax 实例(post,get,form测试)哦,他做了三个相关ajax asp测试实例,都通过了。

index.html





艾恩ajax类
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=" 请求数据中...";
    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 + "
";
            str=str+"请求的方式: " + setting.method + "
";
            str=str+"请求的数据: " + setting.data + "

";
            str=str+"返回的文本: " + obj.responsetext + "

";
            str+="json数据:
";
            str+="我的id是: " + msg.id + "
";
            str+="我的名字是: " + msg.name + "
";
            document.getelementbyid("ajaxresult").innerhtml=str;
        }
    });
    return true;
}

function servervariables(variable){
    document.getelementbyid("variresult").innerhtml=" 变量读取中...";
    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> 


 

艾恩ajax类


   

   
测试1-获取服务器变量,使用get方式

 获取服务器变量 : 文本框失去焦点,自动调用

 
  您可以输入其他相关变量进行测试,例如http_referer,url,server_name

   

   
测试2-提交相对复杂数据,返回json数据,使用post方式
 
  
 

 



 
测试3-ajax提交form
 
 

  文本框:

  复选框1:

  复选框2:

  
  单选框:选项1 选项2

  下拉列表:
  
 

 
 

 
测试4-ajax的简洁调用-get和post方法(统一使用异步获取文本的方式)
 
 
 

ajax类库使用说明
 
   


       
  完整调用统一调用入口:ajax(setting); 关于参数setting,请详细参考下面的说明。


  简洁调用入口:ajax.get(url,data,fn); 以及 ajax.post(url,data,fn);


ajax的配置:

   
var settings = {
   

        asc:
        true,    //true-异步传输;false-同步传输
   

     form:
        formobj,    //表单对象,如果设置本项,则会用ajax提交表单,忽略设置的method,url和data属性
   

        url:
        "",    //若不设置form属性,则本项为必选值

        datatype:
        "text",     //可取值text,xml,json

            method:
            "get",    //可取post,get 不区分大小写。设置form属性后,本项会被忽略。
   

        data:
        "",    //具体格式请看示例程序。设置form属性后,本项会被忽略。

     timeout:
        10000,    //设置超时时间,默认为10秒(即10000毫秒)

        succeed:
        function(a,b,c){return true},
   

        error:
        function(a,b,c){return true},
   

     ontimeout:
        function(a,b,c){return true}
   

};

       
   


   

 

  jo.ajax.js

 

(function(){
 var ajax = window.ajax = function(opt) {
  if(opt.form){
   ajax.fn.postf(opt);
  }else{
   ajax.fn.do(opt);
  }
 };
 ajax.setting={
  asc: true,
  url: "",
  datatype: "text",
  method: "get",
  data: "",
  timeout:10000,
  onlysend:false,
  charset:"utf-8",
  succeed: function(a,b,c){return true},
  error: function(a,b,c){return true},
  ontimeout:function(a){return true}
 };
 ajax.fn = ajax.prototype = {
  do:function(options){
   var settings = ajax.setting;
   if(options) {
    settings = ajax.fn.ajax_extend(settings, options);
   }
   var istimeout=false;
   var s=settings;
   s.method = s.method.touppercase();
   s.charset = s.charset.tolowercase();
   var a=ajax.fn.ajax_getobj();
   var u=s.url;
   var b=u.indexof("?") == -1 ? false:true;
   u= b ? u + "&aienrnd=" + ajax.fn.ajax_rnd() : u + "?aienrnd=" + ajax.fn.ajax_rnd();
   if(s.method=="get"){
    u=s.data=="" ? u : u + "&" + s.data;
   }
   var d=null;
   if(s.method=="post"){
    d=s.data
   }
   a.open(s.method,u,s.asc);
   if(s.method=="post"){
    a.setrequestheader("content-type", "application/x-www-form-urlencoded");
   }
   if(!s.onlysend){
    window.settimeout(function(){istimeout=true;},s.timeout);
    a.onreadystatechange =function(){
     if(istimeout){
      s.ontimeout();
      a.abort();
      a=null; 
      return;
     }
     if(a.readystate==4){
      if(a.status==200){
       var t=s.datatype.tolowercase();
       if(t=="text"){
         s.succeed(a.responsetext,a,s);
       }
       if(t=="xml"){
        s.succeed(a.responsexml,a,s);
        }
       if(t=="json"){
        try{
         eval("j=" + a.responsetext);
        }catch(ex){
         j = null;
        }
        s.succeed(j,a,s);
       }
       a=null;
      }else{
       s.error(a.status,a,s);
       a=null;
      }
     }
    };
   }
   a.send(d);
   if(!s.onlysend){
    if(!(navigator.appname=="microsoft internet explorer")){
     if(a.readystate==4){
      if(a.status==200){
       var t=s.datatype.tolowercase();
       if(t=="text"){
        s.succeed(a.responsetext,a,s);
       }
       if(t=="xml"){
        s.succeed(a.responsexml,a,s);
       }
       if(t=="json"){
        eval("j=" + a.responsetext);
        s.succeed(j,a,s);
       }
       a=null;
      }else{
       s.error(a.status,a,s);
       a=null;
      }
     }
    }
   }
  },
  ajax_getobj:function (){
   var b=null;
   if (window.activexobject) {
    var httplist = ["msxml2.xmlhttp.5.0","msxml2.xmlhttp.4.0","msxml2.xmlhttp.3.0","msxml2.xmlhttp","microsoft.xmlhttp"];
    for(var i = httplist.length -1;i>=0;i--){
     try{
      b= new activexobject(httplist[i]);
      return b;
     }catch(ex){}
    }
   }else if (window.xmlhttprequest) {
    b= new xmlhttprequest();
   }
   return b;
  },
  ajax_rnd :function (){return math.random().tostring().substr(2);},
  ajax_extend:function (a, b){var c={};for(var m in a){c[m]=a[m];}for(var m in b){c[m]=b[m];}return c;}
 };
 
 ajax.get = ajax.fn.get=function(url,data,fn){
  var setting = ajax.setting;
  setting.url = url;
  setting.data = data;
  setting.succeed = fn;
  ajax.fn.do(setting);
 };
 ajax.post = ajax.fn.post=function(url,data,fn){
  var setting = ajax.setting;
  setting.url = url;
  setting.data = data;
  setting.succeed = fn;
  setting.method="post";
  ajax.fn.do(setting);
 };
 ajax.serializ=ajax.fn.serializ=function(nodes,charset){
  charset = charset.tolowercase();
  var data="";
  for(var i=0;i    if(nodes[i].name.trim()==""){continue;}
   if(nodes[i].type.tolowercase()=="checkbox"){
    if(nodes[i].checked==true){
     if(charset=="utf-8"){
      data += nodes[i].name.utf8() + "=" + (nodes[i].value.trim()=="" ? "on": nodes[i].value.utf8()) + "&";
     }else{
      data += nodes[i].name.gb() + "=" + (nodes[i].value.trim()=="" ? "on": nodes[i].value.gb()) + "&";
     }
    }
   }else if(nodes[i].type.tolowercase()=="radio"){
    if(nodes[i].checked==true){
     if(charset=="utf-8"){
      data += nodes[i].name.utf8() + "=" + (nodes[i].value.trim()=="" ? "on": nodes[i].value.utf8()) + "&";
     }else{
      data += nodes[i].name.gb() + "=" + (nodes[i].value.trim()=="" ? "on": nodes[i].value.gb()) + "&";
     }
    }
   }else{
    if(charset=="utf-8"){
     data += nodes[i].name.utf8() + "=" + nodes[i].value.utf8() + "&";
    }else{
     data += nodes[i].name.gb() + "=" + nodes[i].value.gb() + "&"; 
    }
   }   
  }
  return data;
 };
 ajax.postf = ajax.fn.postf=function(setting){
  setting = ajax.fn.ajax_extend(ajax.setting, setting);
  frm = setting.form;
  frm.onsubmit=function(){return false;};
  if(frm.nodename.tolowercase()!="form" || frm.method=="" || frm.action==""){return false;}
  setting.url = frm.action;
  setting.method = frm.method;
  var data="";
  data = ajax.serializ(frm,setting.charset);
  if(data!=""){
   data = data.substr(0,data.length-1);
  }
  setting.data = data;
  ajax.fn.do(setting);
  return false;
 };
 string.prototype.gb=function(){
  return escape(this.tostring());
 };
 string.prototype.utf8=function(){
  return encodeuricomponent(this.tostring());
 };
 string.prototype.unutf8=function(){
  return decodeuricomponent(this.tostring());
 };
 string.prototype.reg=function(r){
  return r.test(this.tostring());
 };
 string.prototype.trim=function(){
  return this.tostring().replace(/(^s*)|(s*$)/g,"");
 };
})();

 

  css.css文件

 

body {font-size:9pt;font-family:verdana,tahoma,arial;}
input,textarea {border:1px #666666 solid;font-size:9pt;padding:3px 3px 0 3px;}
#yjbox {border:1px #dddddd solid;padding:3px;margin:5px 5px 5px 0;width:500px;background-color:yellow;}
.aa {background-color:#ffffff;position:absolute;top:30px;width:200px;height:150px;border:1px red solid;}
.cc {background-color:#ffffff;width:200px;height:150px;border:1px red solid;padding:3px;}
.dd {background-color:green;width:200px;height:150px;border:1px red solid;padding:3px;}
.bb {line-height:25px;text-align:center;background:#f00;}
.content {padding:3px;}
.noborder {border:0px;}
#dragdiv {left:100px;width:300px;top:300px;}
#intro {left:500px;width:650px;top:30px;padding:3px;height:auto;background-color:#ffffff;position:absolute;border:1px red solid;line-height:16px;}
#div1 {left:250px;top:400px;}
#ajaxresult {width:400px;border:1px #dddddd solid;padding:3px;margin:5px 5px 5px 0;}
#variresult {width:500px;border:1px #dddddd solid;padding:3px;margin:5px 5px 5px 0;}
#yjresult {color:red;}
.info {width:400px;border:1px #dddddd solid;padding:3px;margin:5px 5px 5px 0;}

#menu {left:550px;width:250px;top:20px;height:auto;padding:3px;}
#extend {left:550px;width:250px;top:430px;height:auto;padding:3px;}
#code {left:830px;width:250px;top:20px;height:auto;padding:3px;}

测试ajax文件一 test_ajax.asp

<%@ language="vbscript"%>
<%
response.charset="utf-8"
response.write "{id:""" & request.querystring("get") & """,name:""" & request.form("post") & """}"
%>

测试ajax文件二 test_ajax_time.asp

<%@ language="vbscript"%>
<%
response.charset="utf-8"
v=request.querystring("v")
re=trim(request.servervariables(v))
if re="" then re="未找到 " & v & " 相关变量或者变量值为空!"
response.write re
%>

测试ajax文件三 test_post_form.asp

<%@ language="vbscript"%>
<%
response.charset="utf-8"
v=request.querystring
d=request.form
response.write "get方式提交到服务器的数据:" & v & "
post方式提交到服务器的数据:" & d
%>

 

本款实例下载地址

http://down.111cn.net/down/code/asp/2010/1024/21405.html

本文来源:http://www.gdgbn.com/jiaocheng/27583/