jtemplate是一個(gè)基于JQuery的模板引擎插件，功能非常強(qiáng)大，有了她你就再不用為使用JS綁定數(shù)據(jù)集而發(fā)愁了。

主要思路，復(fù)制textarea作為模板，ajax加載json數(shù)據(jù)，添加模板，綁定數(shù)據(jù)，更新加載更多事件。

//加載更多

function fnLoad(data){

listData.Ajax.data.target_page=parseInt(data.currentPage)+1;

function addmore(){

listData.Ajax.load();

}

//動(dòng)態(tài)變換加載更多標(biāo)簽

if(data.totalNums == 0){

$(“#loadOBj”).addClass(“font-disable”).html(“還沒(méi)有錄入數(shù)據(jù)！”).unbind(“click”);

}

if(data.hasNext){

$(“#loadOBj”).html(“加載更多”);

if(data.currentPage==1){

$(“#loadOBj”).bind(“click”,addmore);

}

}else{

$(“#loadOBj”).addClass(“font-disable”).html(“已經(jīng)是最底端了！”).unbind(“click”);

}

}

//Ajaxcallback

function callBackList(data){

var nextHtml = $(‘#listTemplate').prop(“outerHTML”);

var $listObj = listPage==0? ‘#listObj' : ‘#listObj'+listPage;

var $nextListObj = ‘listObj'+(listPage+1);

$($listObj).setTemplateElement(‘listTemplate',null,{filter_data: false});

$($listObj).setParam(“imgDomain”,roomImgDomain);

$($listObj).processTemplate(data);

$($listObj).after($(‘

id:$nextListObj,class:'list-wrap'

})

);

$(‘#'+$nextListObj).append(nextHtml);

listPage++;

var $firstH3 = $(“#listObj .view-Box:first h3″);

$firstH3.next().show();

$firstH3.find(“span”).addClass(“h3-up”).removeClass(“h3-down”);

fnLoad(data);

}

});

}

//ajax

$Ajax.prototype.load = function(){

var _this = this;

$.ajax({

type: “post”,url: _this.url,dataType:'json',data: _this.data,success: function(data){

if(_this.callBack){

_this.callBack(data,_this.id);

}else{

//console.log(“ajax未定義回調(diào)函數(shù)！”);

}

},error:function(){

//console.log(“ajaxerror”);

}

});

}

//調(diào)用

function fnListAjax(){

this.Ajax = new $Ajax();

this.Ajax.url = “”;

this.Ajax.data = {};

}

var listData = new fnListAjax();

fnAjax();

function fnAjax(){

listData.Ajax.url = dataDomain+”/advert/detail.htm”;

listData.Ajax.data = {

code:'index_web'

};

listData.Ajax.callBack = fnCallBackView;

listData.Ajax.load();

};

以上內(nèi)容給大家分享了ajax +jtemplate實(shí)現(xiàn)動(dòng)態(tài)分頁(yè)，希望大家喜歡。

總結(jié)

如果覺(jué)得編程之家網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將編程之家網(wǎng)站推薦給程序員好友。

本圖文內(nèi)容來(lái)源于網(wǎng)友網(wǎng)絡(luò)收集整理提供，作為學(xué)習(xí)參考使用，版權(quán)屬于原作者。

總結(jié)

以上是生活随笔為你收集整理的不用ajax实现动态分页,详解ajax +jtemplate实现动态分页的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。