源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

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

  • 时间:2020-03-18 14:40 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:发布三个ajax相关的函数,包括无刷新提交表单等
几个月前,因为项目需求,我写了下面的三个ajax相关的函数。发布出来和大家分享。 第一个是用来无刷新加载一段HTML 第二个是把表单数据转换成一串请求字符串 第三个是结合函数一和函数二的无刷新提交表单实现。 还有一点要提到的是,无刷新表单提交,还不能对文件上传进行处理,这个主要是因为浏览器的安全设置。目前无刷新的上传,一般是用iframe来实现的。关于这个,我们在google里搜索能找到[url=http://www.google.com/search?q=file+upload+ajax&hl=zh-CN]很多[/url]。 网上虽然已经有很多优秀的ajax的类和函数了,但是或许我这几个函数对大家还有点用处,于是我就发布出来了。 可以在[url=http://www.surfchen.org/scripts/ajax.js]这里[/url]下载。
[u]复制代码[/u] 代码如下:
//@desc    load a page(some html) via xmlhttp,and display on a container //@param   url          the url of the page will load,such as "index.php" //@param   request      request string to be sent,such as "action=1&name=surfchen" //@param   method       POST or GET //@param   container          the container object,the loaded page will display in container.innerHTML //@usage  //         ajaxLoadPage('index.php','action=1&name=surfchen','POST',document.getElementById('my_home')) //         suppose there is a html element of "my_home" id,such as "<span id='my_home'></span>"  //@author  SurfChen <surfchen@gmail.com> //@url     http://www.surfchen.org/ //@license http://www.gnu.org/licenses/gpl.html GPL function ajaxLoadPage(url,request,method,container) {     method=method.toUpperCase();     var loading_msg='Loading...';//the text shows on the container on loading.     var loader=new XMLHttpRequest;//require Cross-Browser XMLHttpRequest     if (method=='GET')     {         urls=url.split("?");         if (urls[1]=='' || typeof urls[1]=='undefined')         {             url=urls[0]+"?"+request;         }         else         {             url=urls[0]+"?"+urls[1]+"&"+request;         }         request=null;//for GET method,loader should send NULL     }     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); } //@desc    transform the elements of a form object and their values into request string( such as "action=1&name=surfchen") //@param   form_obj          the form object //@usage   formToRequestString(document.form1) //@notice  this function can not be used to upload a file.if there is a file input element,the func will take it as a text input. //         as I know,because of the security,in most of the browsers,we can not upload a file via xmlhttp. //         a solution is iframe. //@author  SurfChen <surfchen@gmail.com> //@url     http://www.surfchen.org/ //@license http://www.gnu.org/licenses/gpl.html GPL function formToRequestString(form_obj) {     var query_string='';     var and='';     //alert(form_obj.length);     for (i=0;i<form_obj.length ;i++ )     {         e=form_obj[i];         if (e.name!='')         {             if (e.type=='select-one')             {                 element_value=e.options[e.selectedIndex].value;             }             else if (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="&"         }     }     return query_string; } //@desc    no refresh submit(ajax) by using ajaxLoadPage and formToRequestString //@param   form_obj          the form object //@param   container          the container object,the loaded page will display in container.innerHTML //@usage   ajaxFormSubmit(document.form1,document.getElementById('my_home')) //@author  SurfChen <surfchen@gmail.com> //@url     http://www.surfchen.org/ //@license http://www.gnu.org/licenses/gpl.html GPL function ajaxFormSubmit(form_obj,container) {     ajaxLoadPage(form_obj.getAttributeNode("action").value,formToRequestString(form_obj),form_obj.method,container) }
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部