Javascript重定向似乎只有在chrome调试器打开时才起作用

Javascript redirect only seems to work when chrome debugger is open

本文关键字：调试器 起作用 chrome 重定向 Javascript      更新时间：2023-09-26

我已经编写了一个Jquery Ui对话框，以在特定链接上弹出作为确认。但是，这并不能正确重定向到我的"删除"页面。但是，如果我在chrome中打开调试器进行调试，那么代码将按预期工作。

我发现了同样的问题，但解决方案似乎对我不起作用。不过情况完全一样。这里的问题是JavaScript重定向不起作用，只有在调试程序打开的情况下才能在Chrome中工作

所以我有我的链接

<div id="confirm-dialog">
    <div class="dialog-inner">
        <p id="confirm-dialog-message"></p>
    </div>
</div>
<a href="/Customer/Delete/73865878346587" class="confirmLink" title="Delete Customer" data-confirm-message="Are you sure you want to delete this customer?">Delete</a>

我有我的javascript

    $('.confirmLink').click(function (e) {
    BodyScrolling(false);
    var theHref = $(this).attr("href");
    var theTitle = $(this).attr("title") == null ? "Confirm..." : $(this).attr("title");
    var theText = $(this).attr("data-confirm-message") == null ? "Are you sure?" : $(this).attr("data-confirm-message");
    $("#confirm-dialog-message").html(theText);
    $("#confirm-dialog").parent().css({ position: "fixed" }).end().dialog("open");
    $("#confirm-dialog").dialog({
        title: theTitle,
        close: function() {
            BodyScrolling(true);
        },
        buttons: [
        {
            text: "Yes",
            class: "mws-button red",
            click: function () {
                $("#confirm-dialog").dialog("close");
                window.location.href = theHref;
                return false;
            }
        },
        {
            text: "No",
            class: "mws-button black",
            click: function () {
                $("#confirm-dialog").dialog("close");
            }
        }]
    });
    return false;
});

因此，当我单击Delete链接时，我确实看到了带有Yes和No按钮的确认对话框，css样式正确，并捕获了链接href并将其绑定到Yes按钮。如果我点击"否"，我会被踢回去，不会发生任何进一步的事情-正确！

如果我单击"是"，应该会将我发送到它捕获的原始href。就在重定向之前，我在"是"按钮上发出了警报（Href），它确实向我显示了正确的地址（/Customer/Delete/73865878346587），但重定向没有发生。

当我打开chrome调试器来调试javascript或查看是否出现任何错误时，一切都如预期一样工作，并正确地重定向我！

在IE中，它也不起作用。

我试过。。。

window.location.href = theHref
window.location = theHref
location.href = theHref
$(location).attr('href', theHref)

我还尝试添加return false；在我重定向之后。什么都不管用。

我在上面添加的同一个问题的链接是为了确保"是"按钮在页面上呈现为。。。哪个是我的。

有人能发光吗？

代替window.location.href = theHref;

你试过window.location.replace(theHref);吗？

回到基础，尝试：window.location = theHref;

我找到了答案。Javascript是在转移注意力！

我确实尝试删除confirmLink jQuery类，这样链接就只是一个标准链接，直接指向我的控制器来完成我的删除。当我做这个测试时，链接运行得很好。因此，我将问题表示为我的javascript。然而，情况似乎并非如此，只有当Chrome中的调试器当时已经或正在打开时，它才会再次工作。

当我再次访问非确认链接选项时，我发现它不能正常工作，因此表明问题不在javascript中。

在MVC中，您似乎无法从HTML链接执行Delete操作。这显然是因为涉及到安全风险，因为任何人都可以对Id执行删除操作。我在实现时就考虑到了这一点，并添加了代码来检查请求的来源，如果它不是来自我的列表页面，那么它会返回一个错误，不会执行删除。我给我的控制器命名什么也不重要，例如Test，执行我的HTTPGET请求的链接永远不会碰到这个。必须有某种算法来确定操作正在做什么，并阻止您对HttpGet请求执行操作。有关删除操作的更多信息，请查看此文章http://stephenwalther.com/archive/2009/01/21/asp-net-mvc-tip-46-ndash-donrsquot-use-delete-links-because

您似乎只能通过HTTPPost来执行此操作，这意味着使用Ajax.ActionLink或使用Form和提交按钮。然后必须为HttpPost指定操作。

如果像我一样，你希望将你的链接保留为HTML链接，那么你可以执行以下操作，这就是我所做的，代码如下。我保留了我的HTML链接，设置它指向我的HttpPost删除操作。为jquery添加了我的confirmLink类以将我的对话框绑定到。我选择链接href，并在jquery对话框中设置"是"按钮以动态创建表单，并将发布方法和操作设置为链接href。然后，我可以在新的动态创建的表单上调用submit来执行"发布到我的删除"操作。

我的删除链接

Html.ActionLink("Delete", "Delete", "Caterer", new { id = caterer.Id }, new { @class = "mws-ic-16 ic-delete imageButton confirmLink", @data_confirm_title = "Delete " + caterer.Name, @data_confirm_message = "Are you sure you want to delete this caterer, " + caterer.Name + "?" })

我的Javascript

function LoadConfirm() {
    $('.confirmLink').click(function (e) {
        e.preventDefault();
        BodyScrolling(false);
        var actionHref = $(this).attr("href");
        var confirmTitle = $(this).attr("data-confirm-title");
        confirmTitle = confirmTitle == null ? "Confirm..." : confirmTitle;
        var confirmMessage = $(this).attr("data-confirm-message");
        confirmMessage = confirmMessage == null ? "Are you sure?" : confirmMessage;
        $("#confirm-dialog").dialog({
            autoOpen: false,
            modal: true,
            width: 400,
            closeOnEscape: true,
            close: function () { BodyScrolling(true); },
            title: confirmTitle,
            resizable: false,
            buttons: [
            {
                text: "Yes",
                class: "mws-button red",
                click: function () {
                    StartLoading();
                    $(this).dialog("close");
                    var form = document.createElement("form");
                    form.setAttribute("method", "post");
                    form.setAttribute("action", actionHref);
                    form.submit();
                }
            },
            {
                text: "No",
                class: "mws-button black",
                click: function () {
                    $("#confirm-dialog").dialog("close");
                    return false;
                }
            }
            ]
        });
        $("#confirm-dialog #confirm-dialog-message").html(confirmMessage);
        $("#confirm-dialog").parent().css({ position: "fixed" });
        $("#confirm-dialog").dialog("open");
    });
}

我的行动

    [HttpPost]
    [Authorize(Roles = "User")]
    public ActionResult Delete(long id)
    {
        //Perform my delete
        return RedirectToActionPermanent("List");
    }
相关文章：