单击时刷新页面的按钮

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};

它将转到所需的路径，您将不会收到任何重新发送提示。