我正在使用w3schools Tryit 编辑器中的按钮，并且试图弄清楚当我单击“取消”按钮时如何使我的浏览器重定向到 URL。
这是我尝试过的：
<form action="demo_form.asp" method="get">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<button type="submit" value="Submit">Submit</button>
<button type="reset" value="Reset">Reset</button>
<button type="cancel" onclick="javascript:window.location='http://stackoverflow.com';">Cancel</button>
</form>但它不起作用。有任何想法吗？
cancel不是类型属性的有效值，因此按钮可能默认为submit并继续提交表单。你可能的意思是type="button"。
（虽然javascript:应该删除它，虽然它不会造成任何伤害，但它是一个完全无用的标签）
但是，您没有任何类似按钮的功能，因此最好使用：
<a href="http://stackoverflow.com"> Cancel </a>
… 可能有一些 CSS 让它看起来像一个按钮。
html中没有button type="cancel"。你可以这样尝试
<a href="http://www.url.com/yourpage.php">Cancel</a>
您可以使用 CSS 样式属性使其看起来像一个按钮。
这里有几个问题。
首先，不存在<button type="cancel">，因此它被视为只是<button>。这意味着您的表单将被提交，而不是按钮将您带到其他地方。
其次，javascript:仅在href或action属性中需要 URL 来指定 JavaScript 代码。在内部onclick，已经预期 JavaScript 的地方，它只是充当标签，并没有真正的用途。
最后，使用取消链接而不是取消按钮通常是更好的设计。所以你可以这样做：
<a href="http://stackoverflow.com/">Cancel</a>
使用 CSS 你甚至可以让它看起来像一个按钮，但是使用这个 HTML 绝对不会混淆它应该做什么。
它默认提交表单，最简单的方法是添加“return false”
<button type="cancel" onclick="window.location='http://stackoverflow.com';return false;">Cancel</button>
<input class="button" type="button" onclick="window.location.replace('your_url')" value="Cancel" />
只需输入 type="button"
<button type="button"><b>Cancel</b></button>
因为您的按钮位于表单内，所以它采用默认值作为提交并且 type="cancel" 不存在。
没有按钮类型取消 https://www.w3schools.com/jsref/prop_pushbutton_type.asp
为了实现取消功能，我使用了 DOM 历史
<button type="button" class="btn btn-primary" onclick="window.history.back();">Cancel</button>我知道这是旧的，但我想就此发表我的看法。
为了防止使用内联“onclick”代码，无论好坏，我倾向于做以下事情：
btn-events.js 的代码（对我来说通常位于 /public/js 文件夹中）：
// Select all form buttons with href attribute in DOM
const buttons = document.querySelectorAll('form button[href]');
// Add event listeners for selected buttons
buttons.forEach(btn => {
const href = btn.getAttribute('href');
btn.addEventListener('click', evt => window.open(href, target = '_self'));
});
然后在 HTML 中：
<button class="btn-cancel" type="button" href="/wherever">Cancel</button>
此外，在 HTML 中，在结束 body 标记之前，链接脚本：
<script src="js/btn-events.js"></script>
这种方法允许我控制表单中偶尔出现的一些其他按钮，这些按钮不提交任何内容，但本质上是纯粹的“导航”。
<button onclick=\"window.location='{$_SERVER['PHP_SELF']}';return false;\">Reset</button>
没有足够的代表投票给 Kostyan。这是我的最终解决方案（需要重置按钮）。
再次感谢 Kostyan 回答了所提出的问题，但没有提出使用样式“构建按钮”的“解决方法”（耗时）方法。
这是一个按钮（查看者希望看到的），它完全按照要求工作。它与页面上的其他按钮混合在一起。没有复杂性。
我确实删除了显然没用的“type=cancel”。所以代码更少。:)
这就是我正在使用的尝试。
<a href="index.php"><button style ="position:absolute;top:450px;left:1100px;height:30px;width:200px;"> Cancel </button></a>
在这里，我使用按钮形式的链接进行取消操作。
<button><a href="main.html">cancel</a></button>
使用 Jquery：
$(".cancel-button").click(function (e) {
e.preventDefault();
});