Ajax成功后如何按下按钮？

Question

当Ajax调用成功时，用户将被重定向到主页：

$('#button_1').on('click', function () {
                //code
                $.ajax({
                    method: "POST",
                    url: "/somewhere",
                    data: {
                        //code
                    }
                }).done(function () {
                        location.href = "/";
                });    
            });

重定向后，我想自动单击另一个按钮，这将打开一个模式。 我尝试在内部done功能不同的方法：

.done(function () {
    location.href = "/";
    $('#button_2').click(); // doesn't work 
 }); 

.done(function () {
    location.href = "/";
    setTimeout(function ()
        $('#button_2').click(); // doesn't execute  
    }, 2000);
 });

.done(function () {
    location.href = "/";
    $(document).ready( function () {
        // executes but user is immediately redirected to main page
        $('#button_2').click(); 
    });
 }); 

我还在Ajax调用所在的函数中在Ajax外部进行了尝试，但结果相同。

如何在Ajax调用后以编程方式单击按钮？

Answer 1

您需要在目标（主）页面中添加该逻辑。

重定向后，当前页面不再是活动页面，所有逻辑都将被删除。

您可以在URL中添加一些参数，以便知道由于重定向而到达的时间，例如：

location.href="/?redirect=1"

然后检查该参数

Answer 2

旁边的代码行

location.href = "/";

将不会执行，因为浏览器导航到另一个页面。

因此，您应该将逻辑放在/页面中（ #button_2应该在该页面中）。

Answer 3

您目前正在尝试执行重定向后无法直接执行的代码，因为location.href = "/"之后的代码将永远无法到达。 重定向后，您将拥有一个状态清晰的全新页面。

您当前的功能仍可以如下所示：

$('#button_1').on('click', function () {
    $.ajax({
        method: "POST",
        url: "/somewhere",
        data: {
            //code
        }
    }).done(function () {
            location.href = "/?modal-open=1";
    });    
});

如您所见，我已经向重定向添加了一个查询参数，因此我们知道我们已被重定向以打开模式。

对于您的根页（ / ），您将需要一个如下脚本：

$(document).ready( function () {
    // check the URL for the modal-open parameter we've just added.
    if(location.search.indexOf('modal-open=1')>=0) {
        $('#button_2').click(); 
    }
});

这将检查参数是否在URL中并触发点击。

Answer 4

首先，当您重定向一个新页面时，您将无法访问DOM，因为该页面已重新加载。 您可以为此发送一个参数。

$(document).ready( function () {

    //after page load

    var isButtonActive = findGetParameter("isButtonActive");
    if(isButtonActive){
        alert("button_2 activated");
        $('#button_2').click(); 
    }

    $('#button_1').on('click', function () {
        //code
        $.ajax({
            method: "POST",
            url: "/somewhere",
            data: {
                //code
            }
        }).done(function () {
            alert("page will be reload. button_2 wil be activated");
            location.href = "/?isButtonActive=true";
        });    
    });

    $('#button_2').on('click', function () {
        alert("button_2 clicked");
    });

});

function findGetParameter(parameterName) {
    var result = null,
        tmp = [];
    location.search
        .substr(1)
        .split("&")
        .forEach(function (item) {
          tmp = item.split("=");
          if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]);
        });
    return result;
}

Answer 5

谢谢您的回答。 我进行了更多研究，找到了另一种方法：

$('#button_1').on('click', function () {
                sessionStorage.setItem("reload", "true");
                //code
                $.ajax({
                    method: "POST",
                    url: "/somewhere",
                    data: {
                        //code
                    }
                }).done(function () {
                        location.reload();
                });    
            });

并在主页中：

$(document).ready(function () {
        var reload = sessionStorage.getItem("reload");
        if (reload == "true") {
            $("#button_2").click();
            sessionStorage.setItem("reload", false);
        }
    });