如何进行html5验证然后重定向到另一个页面？

我对此很陌生，但我想知道如何让按钮验证输入然后重定向到页面？我注意到使用该onclick = ""函数会使用适当的输入类型（例如电子邮件、电话）验证输入。但我似乎无法让它在重定向到下一页之前先进行验证。它要么验证但不重定向（我认为它提交了一个表单，因为 URL 更改为像 submit=?），或者它只是重定向到下一页而不进行任何验证

按钮：

<button id ="button" class="subscribe btn btn-success btn-lg btn-block">Proceed to Payment</button>

Javascript：

document.getElementById("button").onclick = function () {
    location.href = "payment.html";
};

这目前根本不做任何验证，只是将它重定向到下一页“payment.html”，如果我删除"location.href = "payment.html";它进行验证但从不重定向。我猜是默认的 onclick 函数是执行 html5 验证的函数，我想我希望在重定向到下一页之前发生这种情况。

如果它很长，我很抱歉，如果有人能帮我解决这个问题，我将不胜感激。谢谢！