利用ajax实现左右分栏局部刷的思路

<span style="font-family: Arial,Helvetica,sans-serif; background-color: rgb(255,255,255);"></span><pre name="code" class="html">利用ajax实现左右分栏局部刷的思路
//左边
<ul>
	<li class="test" data-url="url1"></li>
	<li class="test" data-url="url2"></li>
	<li class="test" data-url="url3"></li
</ul>
//右边
 <div class="contain"></div>

//ajax请求
 $(".test").click(function(){
	var _this = $(this);
	var _url = _this.attr("data-url");
	//这里你就能获取每一个ajax的请求了。
	$.get(_url,function(html){
		$(".contain").empty().append(html);
	});

});

//后台的实现
思路:利用模板引擎+需要加载的数据(比如所有博客的信息)-->生成一个html页面,前端通过请求这个页面的URL来获取生成好的html,显示到右边的内容相应部分即可.

后台模板引擎:1.ejs 2.handlebars(网站:http://handlebarsjs.com/)等

exports.list = function(req,res,next){
    Brand.find({}).sort({'name':1}).exec(function(err,brands){
        if(err){
            return next(err);
        }
        res.render('app/sys/brand-list',{brands:brands});
    });
};

这个是一个路由 app.get('/sys/brand/list',brandController.list);

前端$.get("/sys/brand/lis",function(html){   这样就可以了});

Demo下载地址:http://download.csdn.net/detail/u013310075/7314265

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!