首页 > 代码库 > AJAX异步提交,浏览器总跳出下载界面

AJAX异步提交,浏览器总跳出下载界面

问题:

    我在写一个网页的“用户登录”部分时,要将用户名和密码传到后端验证,想在前端用了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验证结束后判断是否进行提交就可以解决这个问题了!