Ajax应用(prototype.js为框架)

 Ajax应用(prototype.js为框架)

< html >
< head >
< Script  language ="javaScript"  src ="prototype.js" ></ Script >
< script  type ="text/javascript" >
// 用于信息显示
function  async() 
{
     new  Ajax.Request( ' show.asp ' , {
        method:  ' get ' ,
        onSuccess: Success,
        onFailure: Failure
    });
}

// 用于提交表单
function  Send_info()
{
     new  Ajax.Request( ' upload.asp ' , {
        postBody: Formdata( " form1 " ),
        onSuccess:  function  Failure(){ alert( " 提交完成 " ); },
        onFailure: Failure
    });
}

// 自定义的获取表单数据的函数
function  Formdata(form){
     var  f  =  document.getElementById(form), formData  =   '' , len  =  f.elements.length;
     for  ( var  s = 0 ; s < len; s ++ ) {
         var  elem  =  f.elements[s];
         if ((( " radio " == elem.type  ||   " checkbox " == elem.type)  &&   false == elem.checked)  ||  ( " select-one " == elem.type  &&   true == elem.disabled)){ continue ;}
        formData  +=  elem.name + " = " + escape(elem.value) + " & " ;
    }
     return  formData;
}
// 加载成功函数
function  Success(xmlReq){
    document.getElementById( " main_content " ).innerHTML  =  xmlReq.responseText;
};
// 加载失败函数
function  Failure(){
    alert( " 加载失败 " );
};
</ script >
</ head >
< body >
< form  method ="post"  name ="form1"  id ="form1" >
   < input  name ="num"  type ="text"  value ="123" />
   < input  name =""  type ="button"  value ="提交"  onclick ="Send_info()" />
</ form >

< div  id ="main_content" >   </ div >
< script  type ="text/javascript" >
async();
</ script >
</ body >
</ html >