如何将表单中的取消按钮重定向至指定URL？

你的Cancel按钮点击后没反应，核心原因是这个按钮是type="submit"类型——点击它会默认触发表单的提交操作，这会直接覆盖掉你写的window.location.replace跳转逻辑，导致跳转代码根本没机会正常执行。

下面给你几个简单可行的解决办法：

方法1：改为普通按钮（推荐） #

把Cancel按钮的类型从submit改成button，这样点击它就不会触发表单提交，只会执行你的跳转代码：

<input type="button" onclick="window.location.replace('https://www.myurl.ca')" value="Cancel">

⚠️ 注意：URL最好加上完整的协议（https://），避免浏览器把它当作当前页面的相对路径，出现跳转错误。

方法2：阻止表单默认提交行为 #

如果你一定要保留submit类型，可以在onclick里添加阻止默认行为的代码，让跳转优先执行：

<input type="submit" onclick="window.location.replace('https://www.myurl.ca'); return false;" value="Cancel">

return false;会阻止表单的提交动作，确保跳转代码能正常运行。

方法3：使用语义化的<button>标签 #

你也可以用<button>标签，明确指定type="button"，效果和方法1一致，代码更语义化：

<button type="button" onclick="window.location.replace('https://www.myurl.ca')">Cancel</button>

测试以上任意一种方法，Cancel按钮的跳转功能应该就能正常工作了。

内容的提问来源于stack exchange，提问作者user9583164