ajax控制页面跳转

一开始我是这么写的,一直报错,跳转路径解析不了,显示为问号:

前台html:

<form>
    <table style="margin: 200px auto;">
        <tr>
            <td><label for="login_userName">用户名</label></td>
            <td><input type="text" class="form-control" id="login_userName" placeholder="用户名">
            </td>
        </tr>
        <tr>
            <td><label for="login_password">密 码</label></td>
            <td><input type="password" class="form-control" id="login_password" placeholder="密 码">
            </td>
        </tr>
        <tr>
            <td><button type="submit" class="btn btn-default" onclick="login()">登录</button></td>
        </tr>
    </table>
</form>

js

function login(){
    var loginInfo = {
        "loginname":$("#login_userName").val().trim(),
        "password":$("#login_password").val().trim()
    }
    var timestamp=new Date().getTime();
    var url="/pub/frame.html?timestamp="+timestamp;
    $.ajax({
        url: ‘/login/login.do‘,
        type: ‘post‘,
        dataType: ‘json‘,
        contentType:‘application/json‘,
        async:false,
        data: JSON.stringify(loginInfo),
        success: function (data) {
            //正常回调
            if(data.status==0){
                $("#login_userName").val("");
                $("#login_password").val("");
                window.location.href=url;
            }else if(data.status==1) {
                alert(data.msg);
            }
        },
        error:function (data) {
            alert(data.msg);
        }
    });
}

解决方案有三种:

第一种:将提交按钮type由submit改为button

第二种:在跳转页面方法也就是window.location.href=url;后加上window.event.returnValue=false;

第三种:在按钮点击事件中写:onclick="login();return false;"

因为使用ajax跳页提交了一次表单,而submit也会自动提交表单,需要阻断submit的提交。

时间: 2024-12-14 17:33:49

ajax控制页面跳转的相关文章

js控制页面跳转,清缓存,强制刷新页面

单看标题,必定满脸蒙13. 其实,想表达的仅仅是,在js中通过window.location.href控制页面跳转时,有时会跳转至缓存页面,并没有真正去请求要跳转的地址,导致页面数据未能及时加载刷新. 直奔code... 解决办法: 在HTML中埋入隐藏from,通过js调用from进行请求链接地址 <form id='hidden_submit_info' method="post" enctype="multipart/form-data" action=

Jsp页面跳转和js控制页面跳转的几种方法

Jsp 页面跳转的几种方法 1. RequestDispatcher.forward() 在服务器端起作用,当使用forward()时,Servlet engine传递HTTP请求从当前的Servlet或者是JSP到另外的一个Servlet.JSP 或普通HTML文件,也即你的form提交至a.jsp,在a.jsp用到了forward()重定向至b.jsp,此时form提交的所有信息在 b.jsp都可以获得,参数自动传递. 但forward()无法重定向至有frame的jsp文件,可以重定向至有

JS弹出框、对话框、提示框,JS关闭窗口、关闭页面和JS控制页面跳转

一.JS弹出框.对话框.提示框 //====================== JS最常用三种弹出对话框 ======================== //1弹出对话框并输出一段提示信息 function ale() { //弹出一个对话框 alert("提示信息!"); } //2弹出一个询问框,有确定和取消按钮 function firm() { //利用对话框返回的值 (true 或者 false) if (confirm("你确定提交吗?")) { a

js控制页面跳转

1.location.href self.location.href: window.location.href='url':重定向页面并刷新,而window.open('url')只表示打开页面,并不刷新 this.location.href: location.href:以上四种都为本页面跳转 parent.location.href:上一层页面跳转(iframe) top.location.href:最外层页面跳转(iframe) 2.window.history.go(number):

使用AJAX实现页面跳转

$.ajax({ type:"POST", url: //你的请求程序页面随便啦 async:false,//同步:意思是当有返回值以后才会进行后面的js程序. data://请求需要发送的处理数据 success:function(msg){ if (msg) {//根据返回值进行跳转 window.location.href = '你的跳转的目标地址'; } } ajax只接受最后返回的值,不会响应跳转请求更改浏览器地址栏地址转向的,你需要用js判断ajax的返回值是否要跳转,然后

js 控制页面跳转的5种方法

第一种: 复制代码代码如下: <script language="javascript" type="text/javascript">           window.location.href="login.jsp?backurl="+window.location.href;     </script> 第二种: 复制代码代码如下: <script language="javascript"

js 页面跳转 5种方法

js 控制页面跳转的5种方法.原文地址:http://www.jbxue.com/article/11815.html 第一种: <script language="javascript" type="text/javascript"> window.location.href="login.jsp?backurl="+window.location.href; </script> 第二种: <script lang

js实现页面跳转重定向多种方法

分享下js实现页面跳转重定向的几种方式. 第一种: <script language="javascript"type="text/javascript"> window.location.href="http://www.jbxue.com"; </script> 第二种: <script language="javascript"> alert("返回"); wind

登录超时页面跳转和ajax请求时的问题!

今天闲来无事听见后端两个coder探讨如何判断请求是否是ajax请求(通过请求头判断是否是xmlhttprequest 和ie下那个布啦布啦的东西 )了解详情后是为了解决判断登陆超时ajax请求到的是登陆页面的html. 然后我给出了一个设计方式方最然我是一个前端)如下: 1,页面跳转的控制器和form提交的控制继承 基类A 然后 A 有做登陆超时的跳转的处理方法. 2,所有的接口也就是他们说的ajax请求的控制器继承基类B  B里面含有登陆超时时返回状态的功能前端在ajax请求的时候可以做状态