欢迎来到福编程网,本站提供各种互联网专业知识!

发布三个ajax相关的函数,包括无刷新提交表单等

发布时间:2006-08-15 作者: 来源:转载
几个月前,因为项目需求,我写了下面的三个ajax相关的函数。发布出来和大家分享。第一个是用来无刷新加载一段HTML第二个是把表单数据转换成一串请求字符串第三个是结合函数一和函数二的无刷新提交表单实现。还有一点要提到的是,无刷新表单提交,还不能对文件

几个月前,因为项目需求,我写了下面的三个ajax相关的函数。发布出来和大家分享。
第一个是用来无刷新加载一段HTML
第二个是把表单数据转换成一串请求字符串
第三个是结合函数一和函数二的无刷新提交表单实现。

还有一点要提到的是,无刷新表单提交,还不能对文件上传进行处理,这个主要是因为浏览器的安全设置。目前无刷新的上传,一般是用iframe来实现的。关于这个,我们在google里搜索能找到很多。

网上虽然已经有很多优秀的ajax的类和函数了,但是或许我这几个函数对大家还有点用处,于是我就发布出来了。
可以在这里下载。
复制代码 代码如下:
//@descloadapage(somehtml)viaxmlhttp,anddisplayonacontainer
//@paramurltheurlofthepagewillload,suchas"index.php"
//@paramrequestrequeststringtobesent,suchas"action=1&name=surfchen"
//@parammethodPOSTorGET
//@paramcontainerthecontainerobject,theloadedpagewilldisplayincontainer.innerHTML
//@usage
//ajaxLoadPage('index.php','action=1&name=surfchen','POST',document.getElementById('my_home'))
//supposethereisahtmlelementof"my_home"id,suchas""
//@authorSurfChen
//@urlhttp://www.surfchen.org/
//@licensehttp://www.gnu.org/licenses/gpl.htmlGPL
functionajaxLoadPage(url,request,method,container)
{
method=method.toUpperCase();
varloading_msg='Loading...';//thetextshowsonthecontaineronloading.
varloader=newXMLHttpRequest;//requireCross-BrowserXMLHttpRequest
if(method=='GET')
{
urls=url.split("?");
if(urls[1]==''||typeofurls[1]=='undefined')
{
url=urls[0]+"?"+request;
}
else
{
url=urls[0]+"?"+urls[1]+"&"+request;
}

request=null;//forGETmethod,loadershouldsendNULL
}
loader.open(method,url,true);
if(method=="POST")
{
loader.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
}
loader.onreadystatechange=function(){
if(loader.readyState==1)
{
container.innerHTML=loading_msg;

}
if(loader.readyState==4)
{
container.innerHTML=loader.responseText;
}
}
loader.send(request);
}
//@desctransformtheelementsofaformobjectandtheirvaluesintorequeststring(suchas"action=1&name=surfchen")
//@paramform_objtheformobject
//@usageformToRequestString(document.form1)
//@noticethisfunctioncannotbeusedtouploadafile.ifthereisafileinputelement,thefuncwilltakeitasatextinput.
//asIknow,becauseofthesecurity,inmostofthebrowsers,wecannotuploadafileviaxmlhttp.
//asolutionisiframe.
//@authorSurfChen
//@urlhttp://www.surfchen.org/
//@licensehttp://www.gnu.org/licenses/gpl.htmlGPL
functionformToRequestString(form_obj)
{
varquery_string='';
varand='';
//alert(form_obj.length);
for(i=0;i{
e=form_obj[i];
if(e.name!='')
{
if(e.type=='select-one')
{
element_value=e.options[e.selectedIndex].value;
}
elseif(e.type=='checkbox'||e.type=='radio')
{
if(e.checked==false)
{
break;
}
element_value=e.value;
}
else
{
element_value=e.value;
}
query_string+=and+e.name+'='+element_value.replace(/&/g,"%26");
and="&"
}

}
returnquery_string;
}
//@descnorefreshsubmit(ajax)byusingajaxLoadPageandformToRequestString
//@paramform_objtheformobject
//@paramcontainerthecontainerobject,theloadedpagewilldisplayincontainer.innerHTML
//@usageajaxFormSubmit(document.form1,document.getElementById('my_home'))
//@authorSurfChen
//@urlhttp://www.surfchen.org/
//@licensehttp://www.gnu.org/licenses/gpl.htmlGPL
functionajaxFormSubmit(form_obj,container)
{
ajaxLoadPage(form_obj.getAttributeNode("action").value,formToRequestString(form_obj),form_obj.method,container)
}

相关推荐