How can I refresh a page with jQuery?

后端 未结 28 2474
刺人心
刺人心 2020-11-22 07:00

How can I refresh a page with jQuery?

相关标签:
28条回答
  • 2020-11-22 07:29

    You can use JavaScript location.reload() method. This method accepts a boolean parameter. true or false. If the parameter is true; the page always reloaded from the server. If it is false; which is the default or with empty parameter browser reload the page from it's cache.

    With true parameter

    <button type="button" onclick="location.reload(true);">Reload page</button>
    

    With default/ false parameter

     <button type="button" onclick="location.reload();">Reload page</button>
    

    Using jquery

    <button id="Reloadpage">Reload page</button>
    <script type="text/javascript">
        $('#Reloadpage').click(function() {
            location.reload();
        }); 
    </script>
    
    0 讨论(0)
  • 2020-11-22 07:30

    Here are some lines of code you can use to reload the page using jQuery.

    It uses the jQuery wrapper and extracts the native dom element.

    Use this if you just want a jQuery feeling on your code and you don't care about speed/performance of the code.

    Just pick from 1 to 10 that suits your needs or add some more based on the pattern and answers before this.

    <script>
      $(location)[0].reload(); //1
      $(location).get(0).reload(); //2
      $(window)[0].location.reload(); //3
      $(window).get(0).location.reload(); //4
      $(window)[0].$(location)[0].reload(); //5
      $(window).get(0).$(location)[0].reload(); //6
      $(window)[0].$(location).get(0).reload(); //7
      $(window).get(0).$(location).get(0).reload(); //8
      $(location)[0].href = ''; //9
      $(location).get(0).href = ''; //10
      //... and many other more just follow the pattern.
    </script>
    
    0 讨论(0)
  • 2020-11-22 07:35

    There are many ways to reload the current pages, but somehow using those approaches you can see page updated but not with few cache values will be there, so overcome that issue or if you wish to make hard requests then use the below code.

        location.reload(true);
        //Here, it will make a hard request or reload the current page and clear the cache as well.
    
    
        location.reload(false); OR location.reload();
        //It can be reload the page with cache
    
    0 讨论(0)
  • 2020-11-22 07:36

    Use location.reload():

    $('#something').click(function() {
        location.reload();
    });
    

    The reload() function takes an optional parameter that can be set to true to force a reload from the server rather than the cache. The parameter defaults to false, so by default the page may reload from the browser's cache.

    0 讨论(0)
  • 2020-11-22 07:36

    To reload a page with jQuery, do:

    $.ajax({
        url: "",
        context: document.body,
        success: function(s,x){
            $(this).html(s);
        }
    });
    

    The approach here that I used was Ajax jQuery. I tested it on Chrome 13. Then I put the code in the handler that will trigger the reload. The URL is "", which means this page.

    0 讨论(0)
  • 2020-11-22 07:37

    Here is a solution that asynchronously reloads a page using jQuery. It avoids the flicker caused by window.location = window.location. This example shows a page that reloads continuously, as in a dashboard. It is battle-tested and is running on an information display TV in Times Square.

    <!DOCTYPE html>
    <html lang="en">
      <head>
        ...
        <meta http-equiv="refresh" content="300">
        <script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script>
        <script>
        function refresh() {
          $.ajax({
            url: "",
            dataType: "text",
            success: function(html) {
              $('#fu').replaceWith($.parseHTML(html));
              setTimeout(refresh,2000);
            }
          });
        }
        refresh();
        </script>
      </head>
      <body>
        <div id="fu">
          ...
        </div>
      </body>
    </html>
    

    Notes:

    • Using $.ajax directly like $.get('',function(data){$(document.body).html(data)}) causes css/js files to get cache-busted, even if you use cache: true, that's why we use parseHTML
    • parseHTML will NOT find a body tag so your whole body needs to go in an extra div, I hope this nugget of knowledge helps you one day, you can guess how we chose the id for that div
    • Use http-equiv="refresh" just in case something goes wrong with javascript/server hiccup, then the page will STILL reload without you getting a phone call
    • This approach probably leaks memory somehow, the http-equiv refresh fixes that
    0 讨论(0)
提交回复
热议问题