简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
javascript - 在方法裡 window.location.href 不會立即跳轉，有什麼方法可以解決
欧阳克
欧阳克 2017-06-26 10:58:15
0
7
2149

疑問：為何不是執行location.href = "../exit.html";, 而是執行了window.location.href = 'http://www.baidu. com'; ？

有什麼辦法執行完getData(), 如果取得資料失敗，則跳到../exit.html, 不再執行gourl(); 方法呢？

補充：ajax裡面的 async: false 是同步請求！ ！ ！ ，這個只是一個簡單的demo,實際上getData()方法後面可能有很多邏輯，但是如果getData()取得資料失敗，就不讓程式再執行其他的方法，而且其他的方法不一定在同一個文件裡面。 


<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
</head>

<body>
    <p>
        <h2>我是测试页面,看我是否发生跳转</h2></p>
    <script src="https://cdn.bootcss.com/jquery/1.9.0/jquery.min.js"></script>
    <script type="text/javascript">
    $(function() {
        getData();
        gourl();
    });

    function getData() {
        var is_success = false;
        $.ajax({
            type: "GET",
            url: "http://baike.baidu.com/api/openapi/BaikeLemmaCardApi?scope=103&format=json&appid=379020&bk_key=bug&bk_length=600",
            data: "",
            dataType: "json",
            async: false,
            success: function(data) {
                if (data.status == 200) {
                    is_success = true;
                } else {
                    is_success = false;
                }
            }
        });
        if (!is_success) {
            location.href = "../exit.html";
        }
    }

    function gourl() {
        console.log('我被执行了');
        window.location.href = 'http://www.baidu.com';
    }
    </script>
</body>

</html>
欧阳克
欧阳克

温故而知新，可以为师矣。 博客：www.ouyangke.com

全部回覆(7)
女神的闺蜜爱上我
女神的闺蜜爱上我2017-06-26 11:00:15 7樓

那你可以在getData方法success後再回調gourl進行你要的邏輯處理
另外 不清楚你的is_success是具體怎麼判斷 因為有$ajax也有對應的error

點贊 +0
新增回覆
代言
代言2017-06-26 11:00:15 6樓

你的程式碼相當於執行下面這兩句話：

location.href = '../exit.html';
location.href = 'http://www.baidu.com';

這兩句連續執行的時候會跳轉後面這個位址

猜測是瀏覽器訪問第一個需要時間，還未成功，第二個跳轉又來了，所以就放棄第一次跳轉，執行第二次跳轉，類似在url裡面快速輸入兩次地址一樣。

點贊 +0
新增回覆
为情所困
为情所困2017-06-26 11:00:15 5樓

gourl()函數不可以在前面調用，而應該放在Ajax的邏輯中間，在if邏輯後面加上 else{gourl();}
即：

if (!is_success) {
        location.href = "../exit.html";
    }else {
        gourl();
    }
點贊 +0
新增回覆
学习ing
学习ing2017-06-26 11:00:15 4樓

題主的程式碼可以理解為這樣：

    <script type="text/javascript">
    $(function() {
        getData();
    });

    function getData() {
        var is_success = false;
        $.ajax({
            type: "GET",
            url: "http://baike.baidu.com/api/openapi/BaikeLemmaCardApi?scope=103&format=json&appid=379020&bk_key=bug&bk_length=600",
            data: "",
            dataType: "json",
            async: false,
            success: function(data) {
                if (data.status == 200) {
                    is_success = true;
                } else {
                    is_success = false;
                }
            },
            error: function() { ... }
        });
        if (!is_success) {
            location.href = "../exit.html";
        }
        console.log('我被执行了');
        window.location.href = 'http://www.baidu.com';
    }
    </script>

當程式碼中有連續的兩個location.href的時候，會執行後面的跳轉，這個題主可以自己試試看。

另外，由於ajax是異步的，題主需要將if(!is_success)寫到ajax中的error中去，或者寫到success中的else判斷中，否則無論ajax是否成功，都會跳轉。 gourl()同樣應該寫到success中。

此外，直接這樣的ajax應該會發生跨域錯誤的吧，建議使用代理或其他方式解決跨域問題。

點贊 +0
新增回覆
ringa_lee
ringa_lee2017-06-26 11:00:15 3樓

手機碼的，是這個意思不？ 

$(function() {
    var dtd = $.Deferred();
    dtd
      .done(function(){
          console.log('我被执行了');
          window.location.href = 'http://www.baidu.com';
      })
      .fail(function(){
          console.log('我被抛弃了');
          window.location.href = "../exit.html";
      });
    $.get("http://baike.baidu.com/api/openapi/BaikeLemmaCardApi?scope=103&format=json&appid=379020&bk_key=bug&bk_length=600", "json")
      .done(function(data) {
          if (data.status == 200) {
              dfd.resolve();
          } else {
              dtd.reject();
          }
      });
});

主要是用jQ的promise，全部寫成異步，ajax的成功回呼全部放在Deferred的done裡（有多個也可以寫成數組），然後ajax的done裡直接給個狀態就行了。

點贊 +0
新增回覆
某草草
某草草2017-06-26 11:00:15 2樓

既然getData和gourl有執行的關係，要麼把gourl放到回調判斷 這個是可以適合異步的。
如果是題主的同步，那還可以

    $(function() {
        getData();
        gourl();
    });

直接在這裡控制Gourl要不要執行也可以把？

點贊 +0
新增回覆
三叔
三叔2017-06-26 11:00:15 1樓

你的程式碼邏輯有問題吧，ajax是異步的呀。 gourl();這個函數不應該在那個地方呼叫。可以在ajax請求的成功或失敗回呼裡調。
看你的要求應該是在success裡面呼叫。

點贊 +0
新增回覆
熱門專題
更多>
熱門文章
熱門教學
更多>
相關教學
熱門推薦
最新課程
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網：公益線上PHP培訓，幫助PHP學習者快速成長！