ajax提交url与ajax提交表单的详细比较

1：ajax自已构造一个url,这种方式传参数要用Data,不能用于表单提交。
例:


代码如下:

function createHtml(id){
            $("#reloading").show();
             //edit_bg是个div,提交时显示，这样可以使背景页面不能操作。
            $("#edit_bg").show();
            $.ajax({
            type:　"POST",
            url:　"pageAction!createHtml.action",
            data:　"id="+id,
            success:　function(data){
            $("#reloading").hide();
            $("#edit_bg").hide();
            if(data == "true"){
            alert("操作成功。");
              }else{
                    alert("操作失败,请联系管理员！");
                    }
                    }　　　//操作成功后的操作
                  });　
                   }

2：ajax提交表单，这对于大数据传输非常有用，如用户注册，信息量非常大，用ajax提交表单，页面比较美观 但是，对于ajax提交表单，我们还得引入一个js，即：jquery.form.js"
例：


代码如下:

function uploadFile(){

$("#reloading").show();
      $("#edit_bg").show();
       //form1为表单名
      $("#form1").ajaxSubmit({
      type:　"POST",
      success:　function(data){
      $("#reloading").hide();
      $("#edit_bg").hide();
      if(data.indexOf("true")!=-1){
      alert("操作成功。");
      }else{
      alert(data);
       alert("操作失败,请联系管理员！");
      }
        }　　　//操作成功后的操作
       });　
         }

3: 2项中ajax提交表单虽然可以正确操作，但返回的data数据有问题，页面得不到处理结果。如下的代码对ajax提交表单进行了纠正


代码如下:

function submitForm(){
$('#form1').ajaxSubmit(ajaxOptionsNew); 
       }

var ajaxOptionsNew = { 
                beforeSubmit : fn_check_form, 
                success : showResponse, 
                url : "costAtion!save2.action", 
                error : function(XMLResponse) { 
                    alert(XMLResponse.responseText);  
                    alert('操作失败！');
                   // window.location.reload();
                } 
            };

function fn_check_form(){
    if($("#Name").val() == ""){
alert("人不能为空");
$("#Name").focus();
return false;
}
       }

function showResponse(responseText) { 
               try{ 
                //alert(responseText);
                   if(responseText == 'true'){ 
                        alert('操作成功！');
                        window.location.reload();
                   }
                   else if(responseText == 'paramFalse')
                   {
                    alert("必填参数不能为空!")
                   }
                   else if(responseText == 'timeError')
                   {
                     alert("出发时间不能大于报销时间!");
                   }
                   else{ 
                        alert('操作失败！'); 
                     //   window.location.reload();
                    } 
                }catch(e){alert(e.message);} 
        }

赞 (0)

相关推荐

  • 使用ajax实现无刷新改变页面内容和地址栏URL

    在访问现在很火的google plus时,细心的用户也许会发现页面之间的点击是通过ajax异步请求的,同时页面的URL发生了了改变.并且能够很好的支持浏览器的前进和后退.不禁让人想问,是什么有这么强大的功能呢? HTML5里引用了新的API,就是history.pushState和history.replaceState,就是通过这个接口做到无刷新改变页面URL的. 与传统的AJAX的区别 传统的ajax有如下的问题: 虽然ajax可以无刷新改变页面内容,但无法改变页面URL 其次为了更好的可访

  • Jquery Ajax的Get方式时需要注意URL地方

    提示:我们要时刻注意浏览器缓存, 当使用GET方式时要添加时间戳参数 (net Date()).getTime() 来保证每次发送的URL不同, 可以避免浏览器缓存. 提示: 当在url参数后面添加了一个空格, 比如" "的时候, 会出现"无法识别符号"的错误, 请求还是能正常发送. 但是无法加载HTML到DOM. 删除后问题解决. $("#divResult").load("../data/AjaxGetCityInfo.aspx?r

  • PHP curl 抓取AJAX异步内容示例

    PHP curl 抓取AJAX异步内容示例

    其实抓ajax异步内容的页面和抓普通的页面区别不大.ajax只不过是做了一次异步的http请求,只要使用firebug类似的工具,找到请求的后端服务url和传值的参数,然后对该url传递参数进行抓取即可. 利用Firebug的网络工具 如果抓去的是页面,则内容中没有显示的数据,是一堆JS代码. Code $cookie_file=tempnam('./temp','cookie'); $ch = curl_init(); $url1 = "http://www.cdut.edu.cn/defau

  • Ajax无刷新Url提交页面

    尤其是在Jquery,porotype,Ext等框架流行之后,大量简化的代码可说是为程序员带来了福音, 从繁重的代码工作之中解脱出来,轻易的就可以实现过去书写复杂的功能. 不过有利有弊,到如今,习惯了使用各种框架,而很少自己书写内部源码的程序员们,还有几个记得Ajax那其实并不算复杂的基本代码呢? 今天,为了不遗忘当初的热忱,我把这基础的代码再贴出来,给自己回顾一下. 1.对于Ajax来说,判断浏览器的类别是一个重复而且毫无新意的工作,这段代码完全可以封装起来,随意调用. 复制代码 代码如下:

  • JS使用ajax方法获取指定url的head信息中指定字段值的方法

    本文实例讲述了JS使用ajax方法获取指定url的head信息中指定字段值的方法.分享给大家供大家参考.具体分析如下: 下面的JS代码用来获取ajax_info.txt的head信息中的Last modified属性,最后修改时间 <!DOCTYPE html> <html> <head> <script> function loadXMLDoc(url) { var xmlhttp; if (window.XMLHttpRequest) {// code

  • jquery.ajax的url中传递中文乱码问题的解决方法

    JQuery JQuery默认的contentType:application/x-www-form-urlencoded 这才是JQuery正在乱码的原因,在未指定字符集的时候,是使用ISO-8859-1 ISO8859-1,通常叫做Latin-1.Latin-1包括了书写所有西方欧洲语言不可缺少的附加字符. JQuery的Ajax根本没有考虑到国际化的问题,使用了欧洲的字符集,所以才引起了传递中文出现乱码的问题. 而我们的UTF-8则可以解决这一问题. 最终指需要修改JQuery的代码,显式

  • javascript Ajax获取远程url的返回判断

    复制代码 代码如下: <SCRIPT LANGUAGE="JavaScript"> <!-- function ajaxByJyking(){ var xmlhttp_request = ""; try{ if( window.ActiveXObject ){ for( var i = 5; i; i-- ){ try{ if( i == 2 ){ xmlhttp_request = new ActiveXObject( "Microso

  • Ajax+FormData+javascript实现无刷新表单信息提交

    原理: dom收集表单信息,利用FormData快速收集表单信息 ,实例化表单数据对象 同时收集fm的表单域信息. var fd = new FormData(fm); //实例化对象 alert(fd); fd对象内部有收集的form表单域信息 ajax传递表单信息 1.静态显示页面代码 <!DOCTYPE html > <html> <head> <meta http-equiv="Content-Type" content="t

  • ajax跨域(基础域名相同)表单提交的方法

    本文实例讲述了ajax跨域(基础域名相同)表单提交的方法.分享给大家供大家参考.具体如下: 1.要在做ajax提交的页面中添加如下js语句: <script type="text/javascript"> document.domain="基础域名"; </script> 2.ajax表单提交表单时可以使用一个jquery的一个表单插件jquery.form.js 使用语法如下: //fromPost为要收集数据的form表单的id $(&q

  • vue中项目如何提交form格式数据的表单

    目录 vue提交form格式数据的表单 先将数据处理 数据上传 封装文件 vue form表单最简写法 vue提交form格式数据的表单 先将数据处理 let formData = new FormData(); for(let key in this.telForm){      formData.append(key,this.telForm[key]); } 数据上传 //采用封装的post方法上传 this.postRequest('web/login/mobile',formData)

  • 使用 jQuery.ajax 上传带文件的表单遇到的问题

    使用 jQuery.ajax 上传带文件的表单遇到的问题

    今天帮人看代码的时候,遇到一点小问题.使用 jQuery 上传带文件的表单时,会有些问题. 首先,因为使用的是 FormData,所以必须在传入 $.ajax 的参数中配置 processData: false. 否则将会抛出 Illegal invocation 的异常,因为 jQuery 默认是会对传入的 data 字段的数据进行处理的. 官方文档是这么解释的: 其次,注意请求的 Content-Type 首部,默认是 application/x-www-form-urlencoded; c

  • ajax提交url与ajax提交表单的详细比较

    1:ajax自已构造一个url,这种方式传参数要用Data,不能用于表单提交. 例: 复制代码 代码如下: function createHtml(id){             $("#reloading").show();              //edit_bg是个div,提交时显示,这样可以使背景页面不能操作.             $("#edit_bg").show();             $.ajax({             type

  • ajax XMLHTTP Post Form时的表单乱码综合解决

    Part I Post中文内容  先看看E文的表单是怎么提交的: 复制代码 代码如下: <SCRIPT language="JavaScript">   strA = "submit1=Submit&text1=scsdfsd";   var oReq = new ActiveXObject("MSXML2.XMLHTTP");   oReq.open("POST","http://ServerN

  • js表单事件详细汇总

    javascript表单事件汇总 1.onabort(ns3,ns4,ie4):当用户终止正在打开的网页时产生该事件. 2.onblur(ns3,ns4,ie3,ie4):某元素失去活动焦点时产生该事件.例如鼠标在文本框中点击后又在文本框外点击时就会产生. 3.onchange(ns3,ns4,ie3,ie4):当网页上某元素的内容发生改变时产生.例如在文本框中输入文本后又在文本框外点击时就会产生. 4.onclick(ns3,ns4,ie3,ie4)单击网页上的某元素时产生 5.ondblcl

  • 在一个form用一个SUBMIT(或button)分别提交到两个处理表单页面的代码

    复制代码 代码如下: <form onsubmit="aa(this);"> <input type="text" name="" value="test" /><input type="submit" value="提交" /> </form> <iframe src="" name="fA"

  • Javascript异步表单提交，图片上传，兼容异步模拟ajax技术

    前言: 咋一看标题还挺长的呢,还有这么多功能,其实简化一点就是一个功能,异步表单提交,只是在异步表单提交这个大功能下,可以实现图片上传,模拟ajax技术(其实很早以前就是通过这个方式来实现多浏览器的兼容ajax,这里只是怀怀旧,作为一个技术来玩玩),下面的内容需要有一定的js基础,要不然理解起来会比较困难. 注意事项: 这是我bBank里面的一个方法,现在我把他提取出来成一个通用方法来讲解. bBank 框架介绍:http://www.cnblogs.com/bruceli/archive/20

  • jquery+ajax验证不通过也提交表单问题处理

    validationEngine给我们为前端的表单验证减少了很大的工作量.大部分情况我们使用validationEngine验证表单的形式有几种方式: 1 使用正常的表单提交.这种情况validationEngine验证不通过是不会提交表单的. 2 使用ajax提交表单,但是没有使用ajax验证. 这种方式也比较简单,在我们使用ajax请求前检查验证是否通过就可以,例如: 复制代码 代码如下: //验证不通过时return      if(!$("form#ajaxForm").val

随机推荐