【问题标题】:One time page refresh after first page load第一页加载后一次页面刷新
【发布时间】:2011-10-22 13:34:54
【问题描述】:

我想实现一个 JavaScript 代码,它说明了这一点: 如果页面已完全加载,请立即刷新页面,但只刷新一次。 我被困在“只有一次”:

window.onload = function () {window.location.reload()}

这给出了一个没有“仅一次”的循环。如果这有帮助,则会加载 jQuery。

【问题讨论】:

  • 你通过重新加载页面完成了什么?可能有更好的方法来解决问题。
  • 页面上有一个 jquery 全屏图库脚本,但拇指从未完全加载。如果你点击页面的“刷新”按钮,它只会加载其余的按钮......所以很明显我正在寻找某种解决方法......单独给出拇指太复杂(CMS),其他错误修复没有'没有真正的帮助......这是 4 MB 的图像,大约。每个 300kb,在某些时候,图像的拇指不再调整大小和显示(超时?太多,太大??)但页面完成加载。
  • 我在使用 pjax pjax.heroku.com 时遇到了类似的问题(javascripts not working)。

标签: javascript jquery refresh reload


【解决方案1】:

我会说使用哈希,像这样:

window.onload = function() {
    if(!window.location.hash) {
        window.location = window.location + '#loaded';
        window.location.reload();
    }
}

【讨论】:

  • 是的。我只是想建议。
  • 是的,类似于我使用 $_GET 参数的建议,但更容易一些,因为在 JS 中访问哈希比访问 $_GET 参数更容易...
  • 这是最简单的,只要 URL 中还没有散列。在这种情况下,读取 GET 参数会更好。
  • 如何在不附加 url 的情况下做到这一点?
  • 聪明的解决方案!爱它! ❤
【解决方案2】:

当我遇到这个问题时,我会搜索到这里,但大多数答案都是试图修改现有的 url。这是另一个使用 localStorage 对我有用的答案。

<script type='text/javascript'>

(function()
{
  if( window.localStorage )
  {
    if( !localStorage.getItem('firstLoad') )
    {
      localStorage['firstLoad'] = true;
      window.location.reload();
    }  
    else
      localStorage.removeItem('firstLoad');
  }
})();

</script>

【讨论】:

  • 创意解决方案。
  • @Haimei 非常感谢 __/\ __
  • 对于任何想知道的人,这会重新加载页面一次,而不添加或修改原始 URL
  • 这是完美的。谢谢!
【解决方案3】:
<script type="text/javascript">
$(document).ready(function(){    
    //Check if the current URL contains '#'
    if(document.URL.indexOf("#")==-1){
        // Set the URL to whatever it was plus "#".
        url = document.URL+"#";
        location = "#";

        //Reload the page
        location.reload(true);
    }
});
</script>

由于 if 条件,页面只会重新加载一次。我也遇到了这个问题,当我搜索时,我发现了这个不错的解决方案。 这对我来说很好。

【讨论】:

    【解决方案4】:

    检查此链接,它包含一个 java-script 代码,您只能使用它来刷新您的页面一次

    http://www.hotscripts.com/forums/javascript/4460-how-do-i-have-page-automatically-refesh-only-once.html

    刷新页面的方法不止一种:

    解决方案1

    要在每次打开页面时刷新一次页面,请使用:

    <head>
    <META HTTP-EQUIV="Pragma" CONTENT="no-cache">
    <META HTTP-EQUIV="Expires" CONTENT="-1">
    </head>
    

    解决方案2:

    <script language=" JavaScript" >
    <!-- 
    function LoadOnce() 
    { 
    window.location.reload(); 
    } 
    //-->
    </script>
    

    那就换个说法

    <Body onLoad=" LoadOnce()" >
    

    解决方案 3:

    response.setIntHeader("Refresh", 1);

    但此解决方案会根据您指定的时间多次刷新页面

    希望对你有帮助

    【讨论】:

      【解决方案5】:
      <script>
      
      function reloadIt() {
          if (window.location.href.substr(-2) !== "?r") {
              window.location = window.location.href + "?r";
          }
      }
      
      setTimeout('reloadIt()', 1000)();
      
      </script>
      

      效果很好

      【讨论】:

      • 注意:1000 表示 1 秒,您可以将其设置为您想要的任何时间间隔。
      【解决方案6】:

      最后,经过两个月的研究,我得到了一个重新加载页面的解决方案。

      它在我的客户端 JS 项目上运行良好。

      我写了一个函数,下面只重新加载一次页面。

      1) 首先获取浏览器 domloading 时间

      2) 获取当前时间戳

      3) 浏览器 domloading 时间 + 10 秒

      4) 如果浏览器 domloading 时间 + 比当前时间戳大 10 秒,则可以通过“reloadPage();”刷新页面

      但如果不大于 10 秒,则意味着页面只是重新加载,因此不会重复重新加载。

      5) 因此,如果您调用“reloadPage();” js文件页面中某处的函数只会重新加载一次。

      希望对某人有所帮助

      // Reload Page Function //
                      function reloadPage() {
                          var currentDocumentTimestamp = new Date(performance.timing.domLoading).getTime();
                          // Current Time //
                          var now = Date.now();
                          // Total Process Lenght as Minutes //
                          var tenSec = 10 * 1000;
                          // End Time of Process //
                          var plusTenSec = currentDocumentTimestamp + tenSec;
                          if (now > plusTenSec) {
                              location.reload();
                          }
                      }
      
      
                      // You can call it in somewhere //
                      reloadPage();
      

      【讨论】:

        【解决方案7】:

        我把它放在我想要重新加载的页面的头部标签中:

        <?php if(!isset($_GET['mc'])) {
        echo '<meta http-equiv="refresh" content= "0;URL=?mc=mobile" />';
        } ?>
        

        值“mc”可以设置为您想要的任何值,但两者必须在 2 行中匹配。并且“=mobile”可以是“=anythingyouwant”,它只需要一个值来停止刷新。

        【讨论】:

          【解决方案8】:

          像这样使用 window.localStorage...:

          var refresh = window.localStorage.getItem('refresh');
          console.log(refresh);
          if (refresh===null){
              window.location.reload();
              window.localStorage.setItem('refresh', "1");
          }
          

          它对我有用。

          【讨论】:

            【解决方案9】:

            &lt;/body&gt; 标签之后:

            <script type="text/javascript">
            if (location.href.indexOf('reload')==-1)
            {
               location.href=location.href+'?reload';
            }
            </script>
            

            【讨论】:

              【解决方案10】:

              您可以创建一个可验证的once = false,然后使用if else 重新加载您的页面,例如如果once == false 重新加载页面,则使其变为 true。

              【讨论】:

                【解决方案11】:

                您需要使用 GET 或 POST 信息。 GET 将是最简单的。您的 JS 将检查 URL,如果未找到某个参数,它不仅会刷新页面,而是将用户发送到“不同”的 url,这将是相同的 URL,但其中包含 GET 参数.

                例如:
                http://example.com -->会刷新
                http://example.com?refresh=no -->不会刷新

                如果您不想要凌乱的 URL,那么我会在正文的开头包含一些 PHP,它会回显一个隐藏值,该值本质上表示是否包含用于不刷新页面的必要 POST 参数在初始页面请求。之后,您将包含一些 JS 来检查该值并在必要时使用该 POST 信息刷新页面。

                【讨论】:

                  【解决方案12】:

                  试试这个

                  var element = document.getElementById('position');        
                  element.scrollIntoView(true);`
                  

                  【讨论】:

                    【解决方案13】:

                    请用下面的代码试试

                    var windowWidth = $(window).width();
                    
                    $(window).resize(function() {
                        if(windowWidth != $(window).width()){
                        location.reload();
                    
                        return;
                        }
                    });
                    

                    【讨论】:

                      【解决方案14】:

                      使用这个

                      <body onload =  "if (location.search.length < 1){window.location.reload()}">
                      

                      【讨论】:

                        【解决方案15】:

                        这是另一种使用 setTimeout 的解决方案,虽然不完美,但可以:

                        它需要在当前url中有一个参数,所以只是图像当前url看起来像这样:

                        www.google.com?time=1
                        

                        以下代码使页面只重新加载一次:

                         // Reload Page Function //
                            // get the time parameter //
                                let parameter = new URLSearchParams(window.location.search);
                                  let time = parameter.get("time");
                                  console.log(time)//1
                                  let timeId;
                                  if (time == 1) {
                            // reload the page after 0 ms //
                                   timeId = setTimeout(() => {
                                    window.location.reload();//
                                   }, 0);
                           // change the time parameter to 0 //
                                   let currentUrl = new URL(window.location.href);
                                   let param = new URLSearchParams(currentUrl.search);
                                   param.set("time", 0);
                           // replace the time parameter in url to 0; now it is 0 not 1 //
                                   window.history.replaceState({}, "", `${currentUrl.pathname}?${param}`);
                                // cancel the setTimeout function after 0 ms //
                                   let currentTime = Date.now();
                                   if (Date.now() - currentTime > 0) {
                                    clearTimeout(timeId);
                                   }
                                  }
                        

                        接受的答案使用最少的代码并且易于理解。我刚刚为此提供了另一种解决方案。

                        希望这对其他人有所帮助。

                        【讨论】:

                          【解决方案16】:

                          React Hook 为我工作。

                          导入 { useEffect, useState } from 'react';

                            const [load, setLoad] = useState(false);
                          
                            window.onload = function pageLoad() {
                                if (load) {
                                  window.location.reload(true);
                                  setLoad(false);
                                }
                              };
                          

                          【讨论】:

                            【解决方案17】:
                                    var foo = true;
                                    if (foo){
                                        window.location.reload(true);
                                        foo = false;
                            
                                    }
                            

                            【讨论】:

                              【解决方案18】:

                              使用 rel="external" 如下是示例

                              <li><a href="index.html" rel="external" data-theme="c">Home</a></li>
                              

                              【讨论】:

                                猜你喜欢
                                • 2013-12-25
                                • 2013-02-12
                                • 2020-11-08
                                • 1970-01-01
                                • 1970-01-01
                                • 2017-04-12
                                • 2021-11-07
                                • 1970-01-01
                                • 1970-01-01
                                相关资源
                                最近更新 更多