ajax预加载函数,ajax网站怎么完成对访问页面的预加载?

最近做网站,倾向于接口开发的那种,所有的业务会先进页面然后根据业务需求从后台接口拉取数据填充绘制页面,这样带来的一个弊端就是数据加载绘制完成之前页面会很空,而且给用户感觉也不是特别友好,现在我想能不能把下一个页面的脚本先执行完成,数据拉去回来完成绘制了在呈现到客户面前,这样能更友好一点

A页面访问B页面

现在应该是先访问页面在执行ajax绘制方法 中间ajax有个等待

B页面

$(function(){

//init();

//初始化数据

$.post('/**.htm',function(rs){

$.each(rs.list, function(k,v) {

$('.list').append('

'+v+'
')

});

},'json')

})

经过参考其他资料得出下面的解决方案暂未完成

当前页面 {{@pagename}},已访问次数{{@s}}

--------------other------------

index

test

index

(function(){

var os;

var parms = {

$id : '${pageid}' ,

pagename: "index" ,

s: 0 ,

initFun : function(){

os = avalon.vmodels['${pageid}'];

console.log('首页模块');

os.s += 1 ;

$.post('http://192.168.2.99:8080/cate/list.htm',function(rs){

console.log(rs);

},'json');

os.initCallBack();

},

initCallBack : function(){

}

} ;

return parms;

}

)();

这是一个标准页面所有页面都会把脚本和绘制分开执行

var loadpage = function(cxt){

if(first) { first = false ; return ; }

var pathname = cxt.pathname ;

require(['text!' + pathname],function(test){

var div = $('

div.html(test)

// 获取js执行块

var tojsteml = div.find('.jstemp').text().replace(/[\n]/g, '');

var toconfig = new Function("","return " + tojsteml)();

//获取视图模块

var htmlteml = div.find('.htmlteml').html();

if(!avalon.vmodels[toconfig.$id]){

toconfig.initCallBack = function(){

os.content = htmlteml ;

}

console.log('添加构造器')

avalon.define(toconfig) ;

}else{

avalon.vmodels[toconfig.$id].initCallBack = function(){

os.content = htmlteml ;

}

}

avalon.vmodels[toconfig.$id].initFun();

})

发生了错误 ,但是没有影响到页面展示不知道为什么

这是预加载的内容

这是预加载的配置

var os,timer = {};

var parms = {

$id : '${pageid}' ,

list : ['1','12'] ,

initFun : function(){

os = avalon.vmodels[this.$id];

os.initCallBack();

},

initCallBack : function(){}

} ;

return parms;

第一次加载的时候错误

controller SyntaxError: Unexpected identifier

at Function (native)

at Function.a [as render] (https://cdnjs.cloudflare.com/ajax/libs/avalon.js/2.1.5/avalon.min.js:3:15578)

at avalon.directive.update (https://cdnjs.cloudflare.com/ajax/libs/avalon.js/2.1.5/avalon.min.js:2:8537)

at e.exports (https://cdnjs.cloudflare.com/ajax/libs/avalon.js/2.1.5/avalon.min.js:2:7632)

at Object.avalon.directive.diff (https://cdnjs.cloudflare.com/ajax/libs/avalon.js/2.1.5/avalon.min.js:2:8345)

at https://cdnjs.cloudflare.com/ajax/libs/avalon.js/2.1.5/avalon.min.js:3:20846

at String.replace (native)

at o (https://cdnjs.cloudflare.com/ajax/libs/avalon.js/2.1.5/avalon.min.js:3:20768)

at a (https://cdnjs.cloudflare.com/ajax/libs/avalon.js/2.1.5/avalon.min.js:3:20496)

at a (https://cdnjs.cloudflare.com/ajax/libs/avalon.js/2.1.5/avalon.min.js:3:20531) SyntaxError: Unexpected identifier

at Function (native)

at Function.a [as render] (https://cdnjs.cloudflare.com/ajax/libs/avalon.js/2.1.5/avalon.min.js:3:15578)

at avalon.directive.update (https://cdnjs.cloudflare.com/ajax/libs/avalon.js/2.1.5/avalon.min.js:2:8537)

at e.exports (https://cdnjs.cloudflare.com/ajax/libs/avalon.js/2.1.5/avalon.min.js:2:7632)

at Object.avalon.directive.diff (https://cdnjs.cloudflare.com/ajax/libs/avalon.js/2.1.5/avalon.min.js:2:8345)

at https://cdnjs.cloudflare.com/ajax/libs/avalon.js/2.1.5/avalon.min.js:3:20846

at String.replace (native)

at o (https://cdnjs.cloudflare.com/ajax/libs/avalon.js/2.1.5/avalon.min.js:3:20768)

at a (https://cdnjs.cloudflare.com/ajax/libs/avalon.js/2.1.5/avalon.min.js:3:20496)

at a (https://cdnjs.cloudflare.com/ajax/libs/avalon.js/2.1.5/avalon.min.js:3:20531) diffProps error

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值