问题:

我在写一个网页的“用户登录”部分时,要将用户名和密码传到后端验证,想在前端用了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. 项目开发经常使用PHP功能

    日期操作 为了便于存储.比较和交付.我们通常使用strtotime()功能转换的日期UNIX时间戳.有仅用于在显示给用户时date()成经常使用的时间格式. strtotime()  函数将不论什么英 ...

  2. 关于linux 原始套接字编程

    关于linux 网络编程最权威的书是<<unix网络编程>>,但是看这本书时有些内容你可能理解的不是很深刻,或者说只知其然而不知其所以然,那么如果你想搞懂的话那么我建议你可以看 ...

  3. 10个实用的PHP正则表达式汇总

    原文 10个实用的PHP正则表达式汇总 正则表达式是程序开发中一个重要的元素,它提供用来描述或匹配文本的字符串,如特定的字符.词或算式等.但在某些情况下,用正则表达式去验证一个字符串比较复杂和费时.本 ...

  4. MVC验证08-jQuery异步验证

    原文:MVC验证08-jQuery异步验证 本文主要体验通过jQuery异步验证. 在很多的教材和案例中,MVC验证都是通过提交表单进行的.通过提交表单,可以很容易获得验证出错信息.因为,无论是客户端 ...

  5. WCF常见问题(1) -- WebService/WCF Session Cookie

    原文:WCF常见问题(1) -- WebService/WCF Session Cookie 在.net 3.0推出WCF之前使用的WebService,有的应用有使用Session保持一些信息,在不 ...

  6. 74LS183 加法器 【数字电路】

    74LS183 搭的一个还有点意思的加法电路,串行进位的 2+6 == 8 大家都懂的哈哈

  7. elasticsearch集群搭建实例

    elasticsearch集群搭建实例 下个月又开始搞搜索了,几个月没动这块还好没有落下. 晚上在自己虚拟机上搭建了一个简易搜索集群,分享一下. 操作系统环境: Red Hat 4.8.2-16 el ...

  8. 【硬件】DELLserver硬件监控和DELL系统管理工具OMSA介绍

    1.1.1. DELLserver硬件监控和DELL系统管理工具OMSA介绍 本文介绍了利用使用Nagios和OMSA显示器DELLserver硬件健康状况,Nagios监控的方式是NRPE模式,须要 ...

  9. ylb:SQLServer常用系统函数-字符串函数、配置函数、系统统计函数

    原文:ylb:SQLServer常用系统函数-字符串函数.配置函数.系统统计函数 ylbtech-SQL Server:SQL Server-SQLServer常用系统函数 -- ========== ...

  10. HDU2093--考试排名

    考试排名 Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Submissi ...