JavaScript重定向不起作用，并且仅在调试器打开的情况下才在Chrome中起作用 [英] JavaScript redirect not working and works only in Chrome if debugger is turned on

问题描述

以下在成功"上重定向的javascript代码有什么问题?

What is wrong with the following javascript code to redirect on "success"?

$('#recordUser').click(function () {
 $.ajax({
    type: 'POST',
    url: 'api/RecordUser',
    data: $("#recordUserForm").serialize(),
    dataType: 'json',
    success: function (userEmail) {
        var newUrl = "/Home/AnotherPage?email=" + userEmail.Email;
        $(location).attr('href', newUrl);
        //I have also tried following ways to redirect:
        //window.location.href = "/Home/AnotherPage?email=" + userEmail.Email;
        //window.location = "/Home/AnotherPage?email=" + userEmail.Email;
        //window.location.replace(newUrl);
    },
    error: function (xhr, status, err) {
        console.log(xhr);            
    }
 });
});
//#recordUser is a button inside a form with method="post"

HTML :

       <form id="recordUserForm" accept-charset="UTF-8" method="post">
        <div class="...">
         <input id="recordUserEmail" class="span6" name="Email" type="text">
        </div>
        <button class="..." id="recordUser">Submit</button>
       </form>

我已经在Chrome和Firefox中对此进行了测试，并且重定向均未在两者上进行.我已经确保服务器代码可以正常工作.

I have tested this in Chrome and Firefox and the redirect does not happen on both. I have already made sure that my server code is working fine.

在Chrome中，如果我以调试模式运行javascript，则该页面将使用任何重定向命令进行重定向，但是如果我关闭调试器，则重定向命令将停止工作.

In Chrome, if I run the javascript in debug mode then the page is redirected with any of the redirect commands but if I close the debugger the redirect commands stop working.

如果我从html表单中删除了"method"属性，则确实会出现url中的查询字符串，但页面仍位于同一位置.例如，如果我在localhost:80，然后提交表单，则URL更改为localhost:80?email = email而不是预期的newUrl.奇怪的是，如果我在调试中运行它，那么它将按预期工作.为什么?

If I remove the "method" attribute from my html form then the query string in the url does appear but the page stays on the same location. For example if I was at localhost:80 and then submit the form then the url changes to localhost:80?email=email instead of the expected newUrl. Strangely if I run this in debug then it works as expected. Why?

如果有人可以指出错误以及上面的代码仅在Chrome调试模式下起作用的原因，会感到感激/高兴吗?我还想找出如何在错误"回调中打印出有用的错误消息?有用的意思是指使我指向错误源(例如，异常消息，堆栈跟踪等)的东西，而不是必须手动插入的东西.

Would be thankful/happy if someone could point out the mistake and the reason why above code is only working in Chrome debug mode? I would also like to find out how I can get a useful error message to be printed out in my "error" callback? By useful I mean something which points me to the source of the error (eg an exception message, stack trace etc.) and not something that I have to insert manually.

更新1

如果我将html for按钮更改为

If I change the html for button to

        <input class="..." id="recordUser" value="Submit" type="button"/>

并在脚本中使用click方法，则可以正常工作.

and use the click method in the script then it works fine.

我仍然希望得到一个答案，告知我如何使其与button一起工作以及该脚本为何在Chrome调试模式下工作?

I would still appreciate an answer informing me how to get it working with button and why the script was working in Chrome debug mode?

更新2

在发布Update1时，我意识到我在button的html中缺少了type.也许，我认为因为将其标记为button，所以在类型中指定该类型将是多余的，但不是.

While posting Update1 I realized that I was missing the type in the html for button. Maybe, I thought that because it is marked as a button then specifyin the type would be redundant but it is not.

 <button type="button" class="..." id="recordUser">Submit</button>

上面带有原始javascript的标记现在可以按预期运行.因此，我想唯一的问题是，为什么它当时可以在Chrome调试模式下工作?

The above markup with the original javascript now works as expected. So, I guess the only question is why it worked in Chrome debug mode then?

推荐答案

如果window.location = "something"失败，则是因为以下两种可能性之一:

If window.location = "something" fails that is because one of two possibilities:

1. 由于您的ajax查询未成功而未执行该代码(后端可能有问题，请在成功函数的开头使用console.log来检测其是否被执行).
2. 某物"与您的浏览器导航栏中的网址完全相同，因此它确实可以正常工作.

请勿使用它们，因为它们是完全错误的(其他两种方法是正确的):

Don't use these because they are completely wrong (the other two methods are correct):

• $(位置).attr('href'，newUrl);
• window.location.replace(newUrl);

正确的重定向方法如下(两种方法都可以跨浏览器使用):

The correct methods for redirecting are these (either will work crossbrowser):

• window.location =东西";
• window.location.href =某物";

这篇关于JavaScript重定向不起作用，并且仅在调试器打开的情况下才在Chrome中起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！