简述form表单中的submit为什么不能跟ajax类型请求同时使用

之前在学习js的时候学到了ajax，当时遇到一个问题，写了一个form表单，使用ajax请求去提交数据时，总是拿不到返回，折腾了好久之后才发现是因为form表单中的submit和ajax类型的请求不能同时使用。

下面来简单分析一下。

上代码：

提交数据：

 

结果：

 

实际上，form表单在提交时做页面已经做了跳转，提交按钮绑定的事件就算被运行，但是已经不在一个页面上，给人的感觉就是像是ajax请求没有拿到数据一样。

将以下代码修改

<input type="submit" id="submit" value="提交">

改成

<input type="button" id="submit" value="提交">

再次提交

 

这时可以看到，已经请求到了数据。

想想当时我还是too young too simple，这么简单的问题还能折腾好久。