问题:

我在写一个网页的“用户登录”部分时,要将用户名和密码传到后端验证,想在前端用了AJAX异步提交功能,将

用户名密码传到后端,然后后端返回验证结果。但AJAX写好后每次刷新网页都会跳出下载窗口,起初以为是

AJAX传输的数据格式出了问题,导致浏览器误以为后台传来的数据是下载内容(这么猜测的),于是

换了xml,txt,jaon 等格式试了个遍,最后还是没解决。后来翻到这篇帖子,才明白:

http://www.jb51.net/article/32540.htm,我们先看看我的代码:

下面是我前端AJAX部分代码:

$(document).ready(function(){
$("#id_login").click(function(){
if($("#userName").val() == ""){
$("#msgbox").html("Sorry, Empty Username.").addClass('myinfo').fadeTo(900,1,function(){});
return false;
}
if($("#passWord").val() == ""){
$("#msgbox").html("Sorry, Empty PassWord.").addClass('myinfo').fadeTo(900,1,function(){});
return false;
}
$.ajax({
url: 'kzkj_check.jsp',
async:false,
data: 'un='+ $('#userName').val() +'&pw=' + $('#passWord').val(),
type: "get",
success: function(msg){
if(msg.toString().trim() != "ERROR") //TRUE,return username;Message Sent, check and redirect
{ // and direct to the success page
//alert("name true "+msg.toString().trim()+"==");
$("#msgbox").html('Login Verified, Logging in.....').addClass('myinfo').fadeTo(900,1,
function()
{
document.location='kzkj_login.jsp?user='+msg;
});
}
else
{
//alert("name false "+msg.toString().trim()+"==");
$("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
{
$(this).html('Sorry, Wrong Username Or Password.').removeClass().addClass('myerror').fadeTo(900,1);
});
}
},
error:function (err) {
alert("ajax err:"+ err);
}
});
});

“登录”控件的代码如下:

 <INPUT type=submit name=login  value=登录 id=id_login>
                    

这里有个问题:单击控件的时候触发了submit(如上代码),同时也触发了AJAX异步传输,那么,究竟谁先触发,中途二者怎么工作?

根据帖子的意思(http://www.jb51.net/article/32540.htm),先触发AJAX异步传输,由于是异步传输,后台发送数据后在等待前台返回

数据间歇执行了submit,刷新了页面,导致AJAX没收到数据。

问题是,AJAX没收到数据应该执行:

        error:function (err) {
alert("ajax err:"+ err);
}

这段代码啊,前端为何会出现下载提示?

反正我删除submit以后一切正常,有高人知道具体细节的请多多指教。

另外一个解决途径:

还有一个原因是因为我用的是异步提交,没等验证成功的时候已经执行了按钮的提交事件,所以页面已经刷新,将其改成同步提交,按钮的提交事件必须等ajax验证结束后判断是否进行提交就可以解决这个问题了!

AJAX异步提交,浏览器总跳出下载界面的更多相关文章

  1. ASP.NET MVC 网站开发总结(五)——Ajax异步提交表单之检查验证码

    首先提出一个问题:在做网站开发的时候,用到了验证码来防止恶意提交表单,那么要如何实现当验证码错误时,只是刷新一下验证码,而其它填写的信息不改变? 先说一下为什么有这个需求:以提交注册信息页面为例,一般 ...

  2. jQuery选取所有复选框被选中的值并用Ajax异步提交数据

    昨天和朋友做一个后台管理系统项目的时候涉及到复选框批量操作,如果用submit表单提交挺方便的,但是要实现用jQuery结合Ajax异步提交数据就有点麻烦了,因为我之前做过的项目中基本上没用Ajax来 ...

  3. Ajax异步提交登录(2)--登录使用

    http://cjp1989.iteye.com/blog/1740964 1.Ajax的原理: Ajax的原理就是:通过javascript的方式,将前台数据通过xmlhttp对象传递到后台,后台在 ...

  4. ajax 异步 提交 含文件的表单

    1.前言 需求是使用 jquery 的 ajax 异步提交表单,当然,不是简单的数据,而是包含文件数据的表单.于是我想到了 new FormData() 的用法, 可是仍然提交失败,原来是ajax的属 ...

  5. Django之ORM多对多表创建方式,AJAX异步提交,分页器组件等

    MTV与MVC MTV模型: ​ M:模型层(models.py),负责业务对象和数据库关系的映射(ORM) ​ T:模板层(Template),负责如何把页面展示给用户(HTML) ​ V:视图层( ...

  6. 使用ajax异步提交表单

    虽然这篇文章的标题是提交表单,但是主要的难点在于使用ajax提交文本域的内容, 在工作中的经常会需要ajax跨域的问题,通常的需求使用jsonp就可以得到解决,但是当前项目中有一个图片服务器,客户端需 ...

  7. extJs常用的四种Ajax异步提交

    /** * 第一种Ajax提交方式 * 这种方式需要直接使用ext Ajax方法进行提交 * 使用这种方式,需要将待传递的参数进行封装 * @return */function saveUser_aj ...

  8. jquery ajax异步提交表单数据

    使用jquery的ajax方法可以异步提交表单,成功后后台返回json数据,回调函数处理,可以不用刷新页面,达到异步的目的: 处理表单的数据可以用serialize()方法进行序列化,而如果提交的数据 ...

  9. jquery ajax异步提交表单数据的方法

    使用jquery的ajax方法可以异步提交表单,成功后后台返回json数据,回调函数处理,可以不用刷新页面,达到异步的目的: 处理表单的数据可以用serialize()方法进行序列化,而如果提交的数据 ...

随机推荐

  1. 【Socket计划】使用C++实现Server结束Client结束

    我是在Visual Stdio 2013两人的建立project.编译如下两个人main文件,然后测试 服务器:Server.cpp #include <WINSOCK2.H> #incl ...

  2. 速度 Github

    首先需要了解.git 是版本号的管理工具,为了能够把任意代码托管执照:github 其中一个是. 应用 github 什么不该说的帐户. 那么,申请后,在需求 github 并建立了独特的本地机器上的 ...

  3. hdu1047 Integer Inquiry 多次大数相加

    转载请注明出处:http://blog.csdn.net/u012860063 题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1047 Problem ...

  4. linux 在系统启动过程

    从学习<鸟哥linux私人厨房> 用于在计算机系统启动,计算机硬件和软件由(它包含的操作系统软件)包括.对于操作系统在同一台计算机硬件方面的表现,该系统配备有硬件是公用,不同的系统是 的操 ...

  5. C语言利用va_list、va_start、va_end、va_arg宏定义可变參数的函数

    在定义可变參数的函数之前,先来理解一下函数參数的传递原理: 1.函数參数是以栈这样的数据结构来存取的,在函数參数列表中,从右至左依次入栈. 2.參数的内存存放格式:參数的内存地址存放在内存的堆栈段中, ...

  6. post与get,这两人到底神马区别??

    甲曰:“1. GET使用URL或Cookie传参.而POST将数据放在BODY中. 2. GET的URL会有长度上的限制,则POST的数据则可以非常大. 3. POST比GET安全,因为数据在地址栏上 ...

  7. jQuery选取和操纵元素的特点

    jQuery选取和操纵元素的特点 JavaScript选取元素 先来看看不用jQuery的时候我们是怎么处理元素选取的. JavaScript选取元素的时候,可以根据id获取元素,当id不存在的时候, ...

  8. mvc拦截器

    在ASP.NET MVC中,有三种拦截器:Action拦截器.Result拦截器和Exception拦截器.这里说的是第一种和第三种.其实所谓的ASP.NET MVC拦截器,也没什么神秘的,就是一个普 ...

  9. C#6.0 中的那些新特性

    C#6.0 中的那些新特性 前言 VS2015在自己机器上确实是装好了,费了老劲了,想来体验一下跨平台的快感,结果被微软狠狠的来了一棒子了,装好了还是没什么用,应该还需要装Xarmain插件,配置一些 ...

  10. Huffman 压缩和解压缩java实现

    附上完整的代码 http://download.csdn.net/download/u010485034/7847447 Huffman编码原理这里就不说了,是.这里来讲讲利用Huffman编码来进行 ...