jQuery Ajax页面局部加载方法汇总

下面是两个示例js函数，第一个是的重点是对必须内容的获取，通过jquery可以很方便的拿到我们需要的元素的内容。然后用这个内容实现其他的功能，同事还用jquery的方式对页面进行操作，jquery在页面展示中的强大作用，可见一斑。第二个函数主要是通过jquery 的ajax方式 调用指定接口，完成数据操作，然后将数据更新在页面上。ajax的目的是局部更新页面，有时候刷新页面是很不方便的。

function openRej()
{
// 通过jquery找到当前链接同行的其他内容，这里拿到了ID。
id = $(this).parent().parent('tr').find('td:eq(0)').html();
$("#TB_overlayBG").css({
display:"block",height:$(document).height()
});
$(".box").css({
left:($("body").width()-$(".box").width())/2-20+"px",
top:($(window).height()-$(".box").height())/2+$(window).scrollTop()+"px",
display:"block"
});
current_id = id;
}
// 点击某个时间出发这个函数 来对页面进行局部更
function doReject(){
var obj = $(".box input:checked");
var rej_reason = '';
var other = $("#otherbox #other_reject_reason").val();
rej_reason +="`"+other;
if(rej_reason == "`"){
window.alert('亲，至少要填写一个原因哦！');
return ;
}
url = "youurl?id="+current_id+"&reject_reason="+rej_reason;
$.getJSON(url,function(data){
// data 是从请求获得的数据。
if(data.msg == true){
// update data in current line.
color = get_color(data.status);
$("#rej_reason"+current_id).text(data.rea);
status_text = gen_status_text(data.status);
// 更新页面中对应的内容。
$("#status"+current_id).text(status_text);
$("#status"+current_id).css('color',color);
// 执行其他的操作
closeCeng();
}else {
alert('更新失败');
}
});
}