|
例
| 代码如下 |
复制代码 |
|
var a=(function(){
var obj=null;
return {
win:function(config) {
if (config && typeof config == "object") {
this.loadScriptFile(_TC.baseUrl,
function() {
obj= $.dialog(config);
a.bFn();
});
}
},
bFn: fucntion(){
//..处理obj
}
};
})();
|
下面举个例子，异步返回的数据：
<div id="test">...</div>
<script type="text/javascript">
alert('test');
</script>
<div id="test2">..</div>
<script type="text/javascript">
alert('test2');
</script>
异步操作的代码(以jquery代码为例)：
$.get('test.php', function(data){
$('#container').html(data);
})
这样实现的话，异步中的数据会写入到container容器中，但两个script标签中的脚本不会运行，下面说一下解决方案：
1. 将返回的数据以script标签分割开
2. 将含有dom元素的文本分批加入到指定容器中，加入后将文本之间的脚本添加到header中运行(注:添加的过程中，各段需要延迟运行，因为脚本的运行需要时间，延迟的时间以脚本中时间最长的为准)
3. 脚本运行完成后将添加到header中的脚本移出
以下为网上的一段实现代码:
| 代码如下 |
复制代码 |
var global_html_pool = [];
var global_script_pool = [];
var global_script_src_pool = [];
var global_lock_pool = [];
var innerhtml_lock = null;
var document_buffer = "";
function set_innerHTML(obj_id, html, time) {
if (innerhtml_lock == null) {
innerhtml_lock = obj_id;
}
else if (typeof(time) == "undefined") {
global_lock_pool[obj_id + "_html"] = html;
window.setTimeout("set_innerHTML('" + obj_id + "', global_lock_pool['" + obj_id + "_html']);", 10);
return;
}
else if (innerhtml_lock != obj_id) {
global_lock_pool[obj_id + "_html"] = html;
window.setTimeout("set_innerHTML('" + obj_id + "', global_lock_pool['" + obj_id + "_html'], " + time + ");", 10);
return;
}
function get_script_id() {
return "script_" + (new Date()).getTime().toString(36)
+ Math.floor(Math.random() * 100000000).toString(36);
}
document_buffer = "";
document.write = function (str) {
document_buffer += str;
}
document.writeln = function (str) {
document_buffer += str + "n";
}
global_html_pool = [];
var scripts = [];
html = html.split(/</script>/i);
for (var i = 0; i < html.length; i++) {
global_html_pool[i] = html[i].replace(/<script[sS]*$/ig, "");
scripts[i] = {text: '', src: '' };
scripts[i].text = html[i].substr(global_html_pool[i].length);
scripts[i].src = scripts[i].text.substr(0, scripts[i].text.indexOf('>') + 1);
scripts[i].src = scripts[i].src.match(/srcs*=s*("([^"]*)"|'([^']*)'|([^s]*)[s>])/i);
if (scripts[i].src) {
if (scripts[i].src[2]) {
scripts[i].src = scripts[i].src[2];
}
else if (scripts[i].src[3]) {
scripts[i].src = scripts[i].src[3];
}
else if (scripts[i].src[4]) {
scripts[i].src = scripts[i].src[4];
}
else {
scripts[i].src = "";
}
scripts[i].text = "";
}
else {
scripts[i].src = "";
scripts[i].text = scripts[i].text.substr(scripts[i].text.indexOf('>') + 1);
scripts[i].text = scripts[i].text.replace(/^s*<!--s*/g, "");
}
}
var s;
if (typeof(time) == "undefined") {
s = 0;
}
else {
s = time;
}
var script, add_script, remove_script;
for (var i = 0; i < scripts.length; i++) {
var add_html = "document_buffer += global_html_pool[" + i + "];n";
add_html += "document.getElementById('" + obj_id + "').innerHTML = document_buffer;n";
script = document.createElement("script");
if (scripts[i].src) {
script.src = scripts[i].src;
if (typeof(global_script_src_pool[script.src]) == "undefined") {
global_script_src_pool[script.src] = true;
}
}
else {
script.text = scripts[i].text;
}
s += 500;
script.defer = true;
script.type = "text/javascript";
script.id = get_script_id();
global_script_pool[script.id] = script;
add_script = add_html;
add_script += "document.getElementsByTagName('head').item(0).appendChild(global_script_pool['" + script.id + "']);n";
window.setTimeout(add_script, s);
remove_script = "document.getElementsByTagName('head').item(0).removeChild(document.getElementById('" + script.id + "'));n";
remove_script += "delete global_script_pool['" + script.id + "'];n";
window.setTimeout(remove_script, s + 20000);
}
var end_script = "if (document_buffer.match(/<\/script>/i)) {n";
end_script += "set_innerHTML('" + obj_id + "', document_buffer, " + s + ");n";
end_script += "}n";
end_script += "else {n";
end_script += "document.getElementById('" + obj_id + "').innerHTML = document_buffer;n";
end_script += "innerhtml_lock = null;n";
end_script += "}";
window.setTimeout(end_script, s);
} |
|
