网页前后端数据交互

经过几个月关于web的开发，总结下比较基础的数据交互。

form表单提交

在表单中用type="submit"属性的input或者button按钮，点击后表单会将所有有name属性的值（value）以method上的方式(get、post)提交到action上的地址上。

• 仅type="submit"可以直接提交表单，若是按钮就只是单纯点击，需要自行绑定点击事件。
• 以这种方式提交数据页面会跳转，且没有数据返回。
• type="submit"是将表单提交（即form.submit()方法）作为其onclick后的默认事件。

---

$('#form').serializeArray()

这是直接将id="form"的表单所有的name值提交，但不能提交input type="file"的类型。

---

Ajax提交

• get方式提交

$.get("地址",{"键":值, "键":值 },function(data) {
     data   //返回的值
})

• post方式提交

$.post("地址",{"键":值, "键":值 },function(data) {
     data   //返回的值
})

• ajax方式提交

$.ajax({
    type: 'POST',
    url: ,
    data: {"键":值, "键":值 } ,
    dataType: 'json',
    success: function(data){successCallback(data)},
    error: function(jqXHR){failureCallback(jqXHR)},
})

这些提交方式都是不会跳转页面且可以返回数据的。

---

a标签

• URL地址带参数

这种情况是以get方式提交的。

• a标签的点击事件

比较经常用的提交方式，希望能够给大家提供帮助。

---

PS：如果需要页面刷新但不跳转，可以用iframe处理。

  ...