TS开源程序建立在thinkphp框架之上。其中的ui函数封装了淘宝的kissy。ui.box.load可以以弹出页面的形式引用一个页面。如下:
load:function(data,option,type,requestData){
if("undefined" != typeof(_MID_)){ //需要才判断
//增加判断未登录时的登录操作,可能有些地方需要排除.允许弹窗.
// if(_MID_<=0 && option.title!='快速登录'){
if(_MID_<=0){
option.title = '快速登录';
data = U('home/Public/quick_login');
}
}
this.init(option);
var ajaxType = type || "GET";
var ajax = {
url: data, type: type,data:requestData, dataType: 'html', cache: false, success: function(html) {
ui.box.setcontent(html);
ui.box.center();
}
};
ui.box.setcontent('<div style="width:150px;height:70px;text-align:center"><div class="load"> </div></div>');
this.center();
jQuery.ajax(ajax);
},
但是发现一个蛋疼的问题就是,在ui.box.load中引用的灯鹭cc组件无法显示,返回错误为: Uncaught TypeError: Cannot read property 'id' of null
实在是不知道为什么会造成这种情况,如果有高手路过还请指教。
试了很多方法,最后找到了一个解决办法,姑且称之为:移花接木。
在能够正常显示灯鹭cc组件的主页面插入以下代码:
<div class="denglucc" style="display:none">
<script id='denglu_login_js' type='text/javascript' charset='utf-8'></script>
<script type='text/javascript' charset='utf-8'>
(function() {
var _dl_time = new Date().getTime();
var _dl_login = document.getElementById('denglu_login_js');
_dl_login.id = _dl_login.id + '_' + _dl_time;
_dl_login.src = 'http://open.denglu.cc/connect/logincode?appid=YOUAPPID&v=1.0.2&widget=3&styletype=1&size=228_94&asyn=true&time=' + _dl_time;
})();
</script>
</div>
注意display:none。然后再弹出页面用如移花接木的方法,将.denglucc整体作为一个jQuery对象挪过来,当然,原来的.denglucc就不见了。
<script type='text/javascript' charset='utf-8'>
var denglu = $(".denglucc").show();
$(".otherlogin").append(denglu);
</script>
水平实在太有限了,只能做到这样了。不过效果貌似还不错~
总结:
1 遇到移植代码问题时,首先要比较所有的环境变量,比如引用文件之类,一定要反复对照
2 如果还是不能工作,那么考虑将能用的部分移花接木过来