如上一张表单提交，一般我们通常的做法是，form表单提交，方便快捷，提交以后就不用管了，是否完成以及完成以后做什么是提交以后的后台操作，form表单只负责提交过去。（一般后台在接收表单提交以后，根据验证以及数据流转结果给前台交互，常见的是 重定向）。

 

　　 上面是通常的做法，但是有时候会有例外，一个页面上，不光只有一个表单，可能多个，或者，提交表单以后，使用者希望页面不被刷新，但是表单提交是一定会刷新页面的，不刷新则无法提交。所以，我们的ajax出来了，它的无刷新提交成功的解决了这一痛点。

　　 ajax提交的几种好处：

　　 1.它是无刷新的，触发某个提交操作后不会因为页面的刷新导致体验不好（默认无刷新，但是可以在success事件里写页面刷新的JS）

　　 2.它是异步的，异步意味着程序在做这个事情的时候还可以继续去处理其他的事情。

　　

　　好处挺多的，就单纯使用来说，没有form方便，写一堆JS不如一句submit省事.

 

　　ajax提交一般有两种，post和get，这两种形式的区别网上也有很多说明的， 简单描述就是Get就是输入URL在地址栏进行请求这种，post是通过http请求去处理的，post比get相对安全。细说一下ajax的几种写法。

　　常见写法：

　　$.ajax   这种写法可以设置一些属性，比如是否同步、等待时长（超时失败）、跨域等

　　$.post  这种是post请求的简写形式

　　

　　   注意事项：

　　   使用ajax操作数据的时候，一般ajax默认是异步的， 所以和当前数据有关的下一步操作需要放在success里执行，否则可能存在获取不到数据的情况，异步加载出来的数据一般绑定事件的时候也需要结合on方法来使用，而不是简单地$(obj).click(function(){});

　　   

　　   值的一提的是，关于form和ajax使用上的一点区别，上面也说了form使用起来更方便，这点还体现在一个方面，就是form提交是不区分是否跨域的，也就是说提交的地址即便和当前域名不一样，也同样支持提交操作，这意味着使用form的时候不用像ajax一样设置跨域属性。ajax设置跨域的时候除了dataType指定成jsonp，对返回的数据格式也有要求，首先必须是个JSON数据，其次要指定函数名，怎么说呢，如下：

　　   后台研发在提供接口给负责前端数据渲染同事的时候，如果请求不涉及跨域，那么数据返回格式是这样的：

　　　{“name”:”hello”}

　　  而当涉及跨域操作的时候，需要的数据格式是这样的：

　　   callback({“name”:”hello”})

　　　　

　　  callback就是回调函数名，如下：

　　  

　　　在JS里写跨域请求的时候，jsonp默认的名称是callback，如果后台研发同事的数据返回接口前面的函数名是另起的，则需要对应修改，否则请求成功但获取不到数据。同理，当接口数据的返回格式不是 “函数名（JSON字符串）”这种格式的时候，同样会请求成功但不走success，而是走了error，这个时候也不提示具体是什么错误 (*/ω＼*) 这点非常不友好！（仅跨域请求会这样，不涉及跨域请求则忽略）

 

　　    回到刚刚那个问题，form是不区分提交是否跨域的，但是ajax区分，为什么呢？ 经过网上Get一番后知道了，出于浏览器对JS安全的考虑！我们从形式上来分析，form提交表单的时候，只管提交，成功与否完全不用管，都交给后台代码处理了，自身不做任何事，哪怕后台返回过来了状态信息。因为form提交以后页面就直接刷新了，默认刷新当前页（多数时候由后台重定向到某页）。但是ajax不一样，ajax是请求数据，并一定要得到返回结果的，这个结果可以是200，可以是500，可以是404，但必须受到一个结果，ajax最后不是走success函数，那肯定走error函数，通过F12检测浏览器也能查看当前请求返回的状态码是多少，一般状态码200表示请求OK，会走success，其他的会走error（跨域那个数据格式不对的除外，那个数据格式不对也会请求成功但是走error）。

　　   问题就来了，ajax是向指定地址获取数据，它提交数据也是要得到结果的，得到结果也是获取数据的一种形式，这样就涉及到了安全问题，举个简单的栗子：form提交相当于我寄快递不问结果，ajax提交数据相当于寄快递但要求得到回复。为什么说ajax这样会有问题呢，因为ajax是一定会受到一个结果的，这意味着，当有人请求1w次某个接口的时候，会得到1w个回复，通过这个回复，黑客就能找这个接口的漏洞，进而入侵电脑，你给了我你的QQ号，你设置了密码，但是我可以暴力破解，因为我每次尝试密码的时候你都会告诉我这个密码是错误的，并附带一些http相关的信息，所以我有机会盗你号！但是form不一样，不管你怎么“撩我”，我都不会给你明确的回复，是成功还是失败你不知道，得不到我的回复你就看不到我喜好，所以同样的你盗不了我的号，即便你暴力破解，没有回应你也很难判断是对是错。  基于这个原理，浏览器默认的认为form表单提交是安全的，不管你跨域不跨域，随便提交，至于这个叫ajax的，既然你存在这种不安全行为，那只有限制一下了~

 

　　　

　　   总结一下，一般需要用到局部刷新的时候，ajax是最合适之选，一般提交操作页面会跳转的，使用form表单就行了。浏览器虽然出于安全的考虑对ajax做了跨域限制（说是限制其实设置了跨域属性还是能访问，呵呵哒），但真正容易出问题的，还是在接口，凡是暴露在外网的接口，后台程序对传递进来的参数都需要做验证和过滤处理，再进行下一步的操作。