ajax控制頁面跳轉

標籤：type   ajax   ini   content   跳轉頁面   async   解決   login   return   

一開始我是這麼寫的，一直報錯，跳轉路徑解析不了，顯示為問號：

 

前台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的提交。

ajax控制頁面跳轉