Question

我在第一页中有按钮，当我单击第一页中的按钮时，我想刷新第二页？

我一直在使用此代码，但没有用：

var url_home = "{{ url('/') }}";

$(document).ready(function()
{  
    $("#refreshDIV").click(function()
    {
        $("#refreshDIV").reload(url_home);
    });
});

Answer 1

只要两个页面同时打开，就可以使用本地存储在浏览器中完成此操作。

在页面一个中，您可以按以下方式设置本地存储空间：

$("#refreshDIV").click(function()
{
    localStorage.setItem('refreshOtherPage', '0');
    localStorage.setItem('refreshOtherPage', '1');
});

然后在页面两个中，您可以添加侦听器脚本以自动重新加载页面：

//Fired from page ONE tab

    $(window).on('storage', function (e)
    {
        var storageEvent = e.originalEvent;

        if ((storageEvent.key == 'refreshOtherPage')
            && (storageEvent.oldValue == '0')
            && (storageEvent.newValue == '1'))
        {
          // DO WHATEVER YOU WANTED TO DO WHEN THAT BUTTON WAS CLICKED HERE
        }
    });

Answer 2

似乎您将javascript和jquery混合使用。 reload()函数在jquery中不存在。但是，您即将回答您的问题。但是您必须将“第二页”放入div＃id。

<div id="page1"><button id="reload" ...></div>
<div id="page2">the second page, no page headers</div>

还有你的jQuery

var url_home = "{{ url('/') }}";

$(document).ready(function()
{  
    $("button#reload").click(function()
    {
        //font awesome spinner while loading, temporarily replaces #page2
        $("#page2").html('<div class="fas fa-sync fa-spin fa-2x fa-fw"></span>'); 
        $("#page2").load(url_home);
    });
});

您可以通过将其替换为boostrap <a>按钮来使其动态，并捕获URL let url_home = $(this).attr('href');，请不要忘记preventDefault()并在$("a#reload">上触发你选择这个选项。

Answer 3

如果我对您的理解正确，则可以通过在首次启动新标签页时命名链接的target属性来做到这一点。然后，每当您单击用于启动该标签的链接时，它将为您重新加载该标签中的页面。

在页面A中，您可以添加指向页面B的链接，如下所示：

<a href="/page-b" target="page_b">Foo</a>

现在单击该链接，它将在新选项卡中打开页面B。

再次单击，它将重新加载页面B。

但是，当有人直接去/page-b时，这将不起作用。

无需在服务器端编写任何Javascript或其他内容。但是，如果必须动态创建按钮，则可以根据需要调整此方法。希望这会有所帮助！

如果您打算重新加载同一网页的一部分，则可以通过AJAX轻松实现。

如何从第一页的按钮重新加载第二页？

3 个答案: