您的位置:首页技术文章
文章详情页

javascript - 在方法里 window.location.href 不会立即跳转,有什么方法解决

浏览:55日期:2023-05-13 09:28:30

问题描述

疑问:为何不是执行 location.href = 'https://www.haobala.com/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 = 'https://www.haobala.com/exit.html';} } function gourl() {console.log(’我被执行了’);window.location.href = ’http://www.baidu.com’; } </script></body></html>

问题解答

回答1:

那你可以在getData方法success后再回调gourl进行你要的逻辑处理另外 不清楚你的is_success是具体怎么判断 因为有$ajax也有对应的error

回答2:

你的代码相当于执行下面这两句:

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

这两句连续执行的时候会跳转后面这个地址

猜测是浏览器访问第一个需要时间,还未成功,第二个跳转又来了,所以就放弃第一次跳转,执行第二次跳转,类似在url里面快速输入两次地址一样。

回答3:

gourl()函数不可以在前面调用,而应该放在Ajax的逻辑中间,在if逻辑后面添加 else{gourl();}即:

if (!is_success) {location.href = 'https://www.haobala.com/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 = 'https://www.haobala.com/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应该会发生跨域错误的吧,建议使用代理或者其他方式解决跨域问题。

回答5:

手机码的,是这个意思不?

$(function() { var dtd = $.Deferred(); dtd .done(function(){ console.log(’我被执行了’); window.location.href = ’http://www.baidu.com’; }) .fail(function(){ console.log(’我被抛弃了’); window.location.href = 'https://www.haobala.com/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里直接给个状态就行了。

回答6:

既然getData和gourl有执行的关系,要么把gourl放到回调判断 这个是可以适合异步的。如果是题主的同步,那么还可以

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

直接在这里控制Gourl要不要执行也可以把?

回答7:

你的代码逻辑有问题吧,ajax是异步的呀。gourl();这个函数不应该在那个地方调用。可以在ajax请求的成功或者失败回调里调。看你的要求应该是在success里面调用。

标签: JavaScript