html+javascript如何在表单数据提交之前进行友好提示

摘要: 这种问题的应用场景是很多的，在开发用户注册界面时，我们需要对用户是否输入内容做判断，如果用户输入了内容需要对其是否符合名称规范做判断。比如用户注册手机号码，我们需要对手机号码的格式做判断，当这些输入都符合我们的标准的时候才可以让用户注册。

这种问题的应用场景是很多的，比如当用户购物需要删除某订单时，需要弹出对话框用户确认是否继续该操作。我把此种操作称作为用户危险操作。在用户进行危险操作时候务必要对弹窗给出友情提示，危险操作在用户确认之后才可继续进行。

现在这里有一个form表单，表单中有一个操作删除用户的所有历史信息。

<form action = "action" id = "formtest">
//删除用户所有信息...
<input type = "submit" value = "Submit" id = "btn">
</form>

此时为了保证此按钮不是用户无意中点到，确保用户信息安全。需要对这项提交进行验证。

如果按照常规思维：可以通过js判断，并在submit中onclick此函数于是有了一下代码：

<script>
function confirmtest(){
if(confirm("是否确认删除所有数据？此项操作不可逆！")){
document.getElementById("btn").submit();
}
}
</script>

网上很多网友也都是给的这个答案或类似答案，但是这个答案是错误的。

没错，当使用如上代码时候，弹出了对话框，询问用户是否继续，但是不论用户点击确定或者取消，表单都会立即提交数据。--删除用户多有信息。

那么正确的代码是什么？

<form action = "action" id = "formtest" onsubmit = "return confirmsub()">
//删除用户所有信息...
<input type = "submit" value = "Submit" id = "btn">
</form>
<script>
function confirmsub(){
if(confirm("确定要取消此订单吗？")){
return true;
}else{
return false;
}
}
</script>

onsubmit = "return confirmsub()"