jquery ajax用法分类

jquery有封装好的很多函数，用起来非常方便，尤其是在ajax方面。

$.get()

get方法：在获取一个页面，或者是查询，一些不是很重要的参数，毕竟get的缺点是不安全，它会把传递的一些参数自动的添加在url里面，就意味着对用户是可见的，而且对传递的参数大小有限制，URL 的最大长度是 2048 个字符。get方法只允许 ASCII 字符。

$(function(){
$('.finish').click(function(){
var orderNum2 = $(this).closest('tr').find('.nr').text();
console.log(orderNum2);
$.get('/engin/finishOrder/',{
orderNum2:orderNum2
},function(data){
alert(orderNum2+" "+data);
})
$(this).closest('tr').fadeOut('fast');
});
});

$.post()

post方法，相比起get方法更安全，不会追加到url里面，对于传递的大小，类型没有限制。可以实现大数据传递，所以一般用于用户登录，提交表单等。

$(function(){
$("#save").click(function(){
$.post("/server/update/",{
name: $("#id_name").val(),
cs: $("#id_cs").val(),
type: $("#id_type").val(),
name1: $("#id_name1").val()
},function(msg){
alert(msg);
window.close();
});
});
});

load()

例如在局部的刷新一个块时，可以使用load函数，加载一个页面,例如查询、级联。

html代码：

<div class="row"><!--选择部门-->
<div class="col-md-6 form-group form-group-sm">
<label for="id_cata1" class="col-md-4 control-label">一级部门:</label>
<div class="col-md-5">{{dform.cata1}}</div>
</div>
<div id="se" class="col-md-6 form-group form-group-sm"></div>
</div>

加载的页面：

<label for="cata2" class="col-md-6 control-label">二级部门:</label>
<div class="col-md-5">
<select form="xlbd" id="cata2" name="cata2" class="form-control">
{% for t in tyse_list %}
<option value="{{t.dept2}}">{{t.dept2}}</option>
{% endfor %}
</select>

js代码：

$('#id_cata1').change(function(){
var opt=$('#id_cata1 option:selected').val();
if(opt=="--请选择--"){
alert("请选择一个服务项！");
}else{
$('#se').load('/hour/item/',{opt:opt});
}
});

这样，就可以局部的刷新出一个块。

注意：load是默认使用 GET 方式 ， 如果data参数提供一个对象，那么使用 POST 方式。