javascript - 在方法里 window.location.href 不會(huì)立即跳轉(zhuǎn),有什么方法解決
問題描述
疑問:為何不是執(zhí)行 location.href = 'http://www.aoyou183.cn/exit.html';, 而是執(zhí)行了 window.location.href = ’http://www.baidu.com’; ?
有什么辦法執(zhí)行完 getData(), 如果獲取數(shù)據(jù)失敗,則跳轉(zhuǎn)到 ../exit.html, 不再執(zhí)行 gourl(); 方法呢?
補(bǔ)充:ajax里面的 async: false 是同步請求!!!,這個(gè)只是一個(gè)簡單的demo,實(shí)際上getData()方法后面可能有很多邏輯,但是如果getData()獲取數(shù)據(jù)失敗,就不讓程序再執(zhí)行其他的方法,而且其他的方法不一定在同一個(gè)文件里面。
<!DOCTYPE html><html lang='en'><head> <meta charset='utf-8'></head><body> <p><h2>我是測試頁面,看我是否發(fā)生跳轉(zhuǎn)</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 = 'http://www.aoyou183.cn/exit.html';} } function gourl() {console.log(’我被執(zhí)行了’);window.location.href = ’http://www.baidu.com’; } </script></body></html>
問題解答
回答1:那你可以在getData方法success后再回調(diào)gourl進(jìn)行你要的邏輯處理另外 不清楚你的is_success是具體怎么判斷 因?yàn)橛?ajax也有對應(yīng)的error
回答2:你的代碼相當(dāng)于執(zhí)行下面這兩句:
location.href = ’../exit.html’;location.href = ’http://www.baidu.com’;
這兩句連續(xù)執(zhí)行的時(shí)候會(huì)跳轉(zhuǎn)后面這個(gè)地址
猜測是瀏覽器訪問第一個(gè)需要時(shí)間,還未成功,第二個(gè)跳轉(zhuǎn)又來了,所以就放棄第一次跳轉(zhuǎn),執(zhí)行第二次跳轉(zhuǎn),類似在url里面快速輸入兩次地址一樣。
回答3:gourl()函數(shù)不可以在前面調(diào)用,而應(yīng)該放在Ajax的邏輯中間,在if邏輯后面添加 else{gourl();}即:
if (!is_success) {location.href = 'http://www.aoyou183.cn/exit.html'; }else {gourl(); }回答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 = 'http://www.aoyou183.cn/exit.html';}console.log(’我被執(zhí)行了’);window.location.href = ’http://www.baidu.com’; } </script>
當(dāng)代碼中有連續(xù)的兩個(gè)location.href的時(shí)候,會(huì)執(zhí)行后面的跳轉(zhuǎn),這個(gè)題主可以自己試一試。
另外,由于ajax是異步的,題主需要將if(!is_success)寫到ajax中的error中去,或者寫到success中的else判斷中,否則無論ajax是否成功,都會(huì)跳轉(zhuǎn)。gourl()同樣應(yīng)該寫到success中。
此外,直接這樣的ajax應(yīng)該會(huì)發(fā)生跨域錯(cuò)誤的吧,建議使用代理或者其他方式解決跨域問題。
回答5:手機(jī)碼的,是這個(gè)意思不?
$(function() { var dtd = $.Deferred(); dtd .done(function(){ console.log(’我被執(zhí)行了’); window.location.href = ’http://www.baidu.com’; }) .fail(function(){ console.log(’我被拋棄了’); window.location.href = 'http://www.aoyou183.cn/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的成功回調(diào)全部放在Deferred的done里(有多個(gè)也可以寫成數(shù)組),然后ajax的done里直接給個(gè)狀態(tài)就行了。
回答6:既然getData和gourl有執(zhí)行的關(guān)系,要么把gourl放到回調(diào)判斷 這個(gè)是可以適合異步的。如果是題主的同步,那么還可以
$(function() {getData();gourl(); });
直接在這里控制Gourl要不要執(zhí)行也可以把?
回答7:你的代碼邏輯有問題吧,ajax是異步的呀。gourl();這個(gè)函數(shù)不應(yīng)該在那個(gè)地方調(diào)用。可以在ajax請求的成功或者失敗回調(diào)里調(diào)。看你的要求應(yīng)該是在success里面調(diào)用。
