SSM 整合项目开发到一个阶段,想慢慢地把前台框架等技术引入进来
突然碰到一个困惑好久的问题:
ajax 替换原本 form 表单 post 提交登录:
一直 404 错误,心塞。。。。
最后发现原来是 ajax 绑定 button click 事件时候,会触发 form 表单的 post 方法,从而 改变 url 地址 cancel 掉了 XHR 的请求。。。阿西吧。。。
记得去掉这个 form标签啊啊啊啊!!!
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
<form action=.....method.....>
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
//最原始的jquery实现表单提交 /* $("#login").click(function(){ // method="post" action="/loginCheck" $("#loginForm").attr("action","/loginCheck"); $("#loginForm").attr("method","post"); $("#loginForm").submit(); });*/
关键 AJAX 代码:
$(function(){} 当然这个是要包裹在外层的
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
$("#login").click(function(){ var allData = {'name':$("#userName").val() , 'password':$("#password").val()} $.ajax({ type:"post", url:"${pageContext.request.contextPath}/loginCheck", contentType:"application/json;charset=utf-8", dataType:"json", data:JSON.stringify(allData), error: function(XMLHttpRequest, textStatus, errorThrown) { alert(XMLHttpRequest.status); alert(XMLHttpRequest.readyState); alert(textStatus); alert(errorThrown) }, success:function(data){ alert(data['result']); var response=data['result']; if(response==="false"){ window.location.href="/login"; } else {window.location.href="/items/queryItems";} } }) });
最后,还是 建议不要用 ajax 做登录验证,虽然 ajax 可以实现,但是直接 form 表单提交是明智的选择,不用暴露 参数
最后呢,引用一波 别人的说法,使用 form 的 submit 方法 避免 参数暴露
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
Ajax post请求跳转页面 转载 2016-12-30 作者:荒年-yang 我要评论 这篇文章主要介绍了Ajax post请求跳转页面的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下 最近因为公司需求,需要ajax post请求并跳转界面,网上搜了一下资料,差不多都是用window.location.href来处理,但是在请求页面的地址栏中会暴露请求的参数,这是不安全的。 ? 1 2 3 4 5 6 7 8 $.post( url, {method:"regist",userName:$nameEle.val(),email:$emailEle.val(),password:$passwordEle.val()}, function(data) { //注册成功页面跳转, window.location.href ="../yiliaoqixie/login.html?name="+$nameEle.val(); } ); 因此,只能想到了通过form表单来进行post提交。 ? 1 2 3 4 5 6 7 8 9 10 11 <form method="post" action="action" id="fm"> </form> $.post( url, {method:"regist",userName:$nameEle.val(),email:$emailEle.val(),password:$passwordEle.val()}, function(data) { //注册成功页面跳转, var fm=document.getElementById("fm"); fm.submit(); } );