單擊時刷新頁面的按鈕

Question

我需要一個按鈕，可以在用戶單擊時刷新頁面。 我試過這個：

<input type="button" value="Reload Page" onClick="reload">

或者

<input type="button" value="Refresh Page" onClick="refresh">

但都沒有奏效。

Answer 1

將onClick與window.location.reload()一起使用，即：

<button onClick="window.location.reload();">Refresh Page</button>

或history.go(0) ，即：

<button onClick="history.go(0);">Refresh Page</button>

或window.location.href=window.location.href用於“完全”重新加載，即：

<button onClick="window.location.href=window.location.href">Refresh Page</button>

---

Button 元素 - developer.mozilla.org

Answer 2

這對我有用：

function refreshPage(){
    window.location.reload();
} 

<button type="submit" onClick="refreshPage()">Refresh Button</button>

Answer 3

我注意到這里的所有答案都使用內聯onClick處理程序。 通常建議將 HTML 和 Javascript 分開。

這是一個將單擊事件偵聽器直接添加到按鈕的答案。 當它被點擊時，它會調用location.reload導致頁面重新加載當前的 URL。

 const refreshButton = document.querySelector('.refresh-button'); const refreshPage = () => { location.reload(); } refreshButton.addEventListener('click', refreshPage)

 .demo-image { display: block; }

 <button class="refresh-button">Refresh!</button> <img class="demo-image" src="https://picsum.photos/200/300">

Answer 4

<a onClick="window.location.reload()">Refresh</a>

這對我來說真的很完美。

Answer 5

只有這個真正重新加載頁面（今天）

<input type="button" value="Refresh Page" onClick="location.href=location.href">

其他人不完全重新加載。 它們將值保存在文本框中。

Answer 6

只需在鏈接上創建空引用，如下所示

 <a href="" onclick="dummy(0);return false;" >

Answer 7

<button onclick=location=URL>Refresh</button>

這可能看起來很有趣，但它確實起到了作用。

Answer 8

單擊時刷新頁面的按鈕

使用帶有 window.location.reload() 的 onClick 按鈕：

<button onClick="window.location.reload();">

Answer 9

<button onClick="window.location.reload();">Reload</button>

或者你也可以使用

<form action="<same page url>" method="GET">
<button>Reload</button>
</form>

注意： "<same page link>"更改為要重新加載的同一頁面的 url。 例如： <form action="home.html> method="GET">

Answer 10

雖然問題是關於button ，但如果有人想使用<a>刷新頁面，你可以簡單地做

<a href="./">Reload</a>

Answer 11

使用它對我來說可以很好地重新加載同一頁面：

<button onClick="window.location.reload();">

Answer 12

   <script>
    function locationreload() {
        location.reload();
          
    }
   </script>

    <button type="submit" onclick="return confirm('Do you really want to refresh your page?') , locationreload();" class="btn btn-success">Refresh</button>

Answer 13

如果您正在尋找表格重置：

<input type="reset" value="Reset Form Values"/>

或重置瀏覽器未處理的表單的其他方面

<input type="reset" onclick="doFormReset();" value="Reset Form Values"/>

使用 jQuery

function doFormReset(){
    $(".invalid").removeClass("invalid");
}

Answer 14

我不想使用 JavaScript，所以我想出了一種使用“隱藏表單”的方法。 這是一個例子：

<form method="get" accept-charset="utf-8">
  <label for="name">Name:</label>
  <input type="text" id="name" name="name">

  <input type="submit" value="Read">
  <input type="submit" value="Reload" form="hidden_form">
</form>

<form id="hidden_form" method="get"></form>

Answer 15

<button type="submit" onclick="refresh">refresh</button>

這對我有用！

Answer 16

在設計網站時，考慮內容安全策略和禁用 JavaScript 用戶的最佳實踐始終很重要。

onClick等內聯腳本是一個漏洞。

- 忽略<noscript>標記並設置隱藏元素的樣式，然后使用 JS 更改display:回到其各自的樣式會強制用戶啟用 JS。

這是所有情況下最簡單的解決方案。

<a href="/">Reload Page</a>

Answer 17

如果您的 reactjs 應用程序上有路由，只需使用以下功能：

import React from "react";
import PropTypes from "prop-types";
import { useHistory } from "react-router-dom";

const Home = () => {
const directToProfile = () => {
    let route = `Profile`;
    history.push(route);
    window.location.reload()
  };
    return (
        <div>
            <li className="sidebar-item">
                {" "}
                <a
                  className="sidebar-link sidebar-link"
                  href="javascript:void(0);"
                  aria-expanded="false"
                >
                  <i data-feather="home" className="feather-icon" />
                  <span className="hide-menu" onClick={directToProfile}>
                    Home
                  </span>
                </a>
              </li>
        </div>
    )
}

export default Home

Answer 18

不需要Js，你可以把button標簽放在一個form標簽里：

<form>  
  <button class="restart-btn">Restart</button>
</form>

測試一下，給我你的意見！

Answer 19

“重新加載”和“刷新”不是 JavaScript 函數。 嘗試使用以下代碼：

 function reload() { window.location.refresh(); }

 <button onClick="reload()"></button>

Answer 20

window.opener.location.href ='workItem.adm?wiId='+${param.wiId};

它將轉到所需的路徑，您將不會收到任何重新發送提示。