Javascript 如何在执行嵌入式脚本时插入使用$.ajax()加载的完整页面的一部分?
如果满足某些条件,我将使用$.ajax在我的站点上加载新页面。基于flash的无线电播放器处于活动状态。但是,对于这种情况,我不希望修改服务器端输出 现在,我需要一种方法来将响应嵌入到我的页面中,这可以使用.replaceWith轻松完成,但也可以执行嵌入在该页面中的Java脚本 我的一个想法是创建一个类似于的虚拟div,但也许有一种更好的方法不需要更改我的html代码,即纯js/jquery解决方案 请注意,使用$elem.load是不可能的,因为如果只使用检索到的文档的一个片段,它不会计算任何脚本: //在中插入文档内容,删除脚本 //避免IE中出现任何“权限被拒绝”错误Javascript 如何在执行嵌入式脚本时插入使用$.ajax()加载的完整页面的一部分?,javascript,jquery,ajax,Javascript,Jquery,Ajax,如果满足某些条件,我将使用$.ajax在我的站点上加载新页面。基于flash的无线电播放器处于活动状态。但是,对于这种情况,我不希望修改服务器端输出 现在,我需要一种方法来将响应嵌入到我的页面中,这可以使用.replaceWith轻松完成,但也可以执行嵌入在该页面中的Java脚本 我的一个想法是创建一个类似于的虚拟div,但也许有一种更好的方法不需要更改我的html代码,即纯js/jquery解决方案 请注意,使用$elem.load是不可能的,因为如果只使用检索到的文档的一个片段,它不会计算任
我不知道有关这个IE问题的任何细节,但当然,无论您建议的代码是什么,都不会在最近的IE版本中导致错误。我不关心IE6。您尝试过使用load吗 我相信它应该为您解析脚本并执行它们 编辑: 好的,要么是关于负载不可用的问题,要么是我没有发现它。考虑到这一点,我创建了一个没有脚本剥离的新版本load,它似乎可以在IE6、7、8、Chrome和Firefox中找到。。。不确定jQuery库为什么会这样做:
<script type="text/javascript">
$(function() {
setTimeout(function() {
$('#target').load2('inject.html #inject');
}, 5000);
});
jQuery.fn.extend({
load2: function(url, params, callback) {
if (typeof url !== "string" && _load) {
return _load.apply(this, arguments);
// Don't do a request if no elements are being requested
} else if (!this.length) {
return this;
}
var off = url.indexOf(" ");
if (off >= 0) {
var selector = url.slice(off, url.length);
url = url.slice(0, off);
}
// Default to a GET request
var type = "GET";
// If the second parameter was provided
if (params) {
// If it's a function
if (jQuery.isFunction(params)) {
// We assume that it's the callback
callback = params;
params = undefined;
// Otherwise, build a param string
} else if (typeof params === "object") {
params = jQuery.param(params, jQuery.ajaxSettings.traditional);
type = "POST";
}
}
var self = this;
// Request the remote document
jQuery.ajax({
url: url,
type: type,
dataType: "html",
data: params,
// Complete callback (responseText is used internally)
complete: function(jqXHR, status, responseText) {
// Store the response as specified by the jqXHR object
responseText = jqXHR.responseText;
// If successful, inject the HTML into all the matched elements
if (jqXHR.isResolved()) {
// #4825: Get the actual response in case
// a dataFilter is present in ajaxSettings
jqXHR.done(function(r) {
responseText = r;
});
// See if a selector was specified
self.html(selector ?
// Create a dummy div to hold the results
jQuery("<div>")
// inject the contents of the document in, removing the scripts
// to avoid any 'Permission Denied' errors in IE
.append(responseText/*.replace(rscript, "")*/)
// Locate the specified elements
.find(selector) :
// If not, just inject the full result
responseText);
}
if (callback) {
self.each(callback, [responseText, status, jqXHR]);
}
}
});
return this;
}
});
</script>
你试过使用load吗 我相信它应该为您解析脚本并执行它们 编辑: 好的,要么是关于负载不可用的问题,要么是我没有发现它。考虑到这一点,我创建了一个没有脚本剥离的新版本load,它似乎可以在IE6、7、8、Chrome和Firefox中找到。。。不确定jQuery库为什么会这样做:
<script type="text/javascript">
$(function() {
setTimeout(function() {
$('#target').load2('inject.html #inject');
}, 5000);
});
jQuery.fn.extend({
load2: function(url, params, callback) {
if (typeof url !== "string" && _load) {
return _load.apply(this, arguments);
// Don't do a request if no elements are being requested
} else if (!this.length) {
return this;
}
var off = url.indexOf(" ");
if (off >= 0) {
var selector = url.slice(off, url.length);
url = url.slice(0, off);
}
// Default to a GET request
var type = "GET";
// If the second parameter was provided
if (params) {
// If it's a function
if (jQuery.isFunction(params)) {
// We assume that it's the callback
callback = params;
params = undefined;
// Otherwise, build a param string
} else if (typeof params === "object") {
params = jQuery.param(params, jQuery.ajaxSettings.traditional);
type = "POST";
}
}
var self = this;
// Request the remote document
jQuery.ajax({
url: url,
type: type,
dataType: "html",
data: params,
// Complete callback (responseText is used internally)
complete: function(jqXHR, status, responseText) {
// Store the response as specified by the jqXHR object
responseText = jqXHR.responseText;
// If successful, inject the HTML into all the matched elements
if (jqXHR.isResolved()) {
// #4825: Get the actual response in case
// a dataFilter is present in ajaxSettings
jqXHR.done(function(r) {
responseText = r;
});
// See if a selector was specified
self.html(selector ?
// Create a dummy div to hold the results
jQuery("<div>")
// inject the contents of the document in, removing the scripts
// to avoid any 'Permission Denied' errors in IE
.append(responseText/*.replace(rscript, "")*/)
// Locate the specified elements
.find(selector) :
// If not, just inject the full result
responseText);
}
if (callback) {
self.each(callback, [responseText, status, jqXHR]);
}
}
});
return this;
}
});
</script>
大致如下:
$('container').html(text_from_ajax_request);
$('container script').each(function(){
var $this = $(this);
src = $this.attr('src');
src ? $.getScript(src) : eval($(this).text());
});
大致如下:
$('container').html(text_from_ajax_request);
$('container script').each(function(){
var $this = $(this);
src = $this.attr('src');
src ? $.getScript(src) : eval($(this).text());
});
实际上,我用一种肮脏的解决方案解决了这个问题,但效果很好: 我在实际的内容部分周围添加了注释,这些注释在我的服务器端模板的任何其他地方都不会使用。 然后,我使用数据类型“text”获取整个内容,并使用字符串函数提取感兴趣的部分。这是安全的,因为我查找第一个开始注释和最后一个结束注释,因此实际内容不会导致任何问题,即使出于某种原因它包含这些注释
在此之后,我使用.html更新我的元素。重要的是,我不会从检索到的html代码中创建DOM元素,因为这会破坏脚本标记。事实上,我使用了一种肮脏的解决方案解决了它,但效果很好: 我在实际的内容部分周围添加了注释,这些注释在我的服务器端模板的任何其他地方都不会使用。 然后,我使用数据类型“text”获取整个内容,并使用字符串函数提取感兴趣的部分。这是安全的,因为我查找第一个开始注释和最后一个结束注释,因此实际内容不会导致任何问题,即使出于某种原因它包含这些注释
在此之后,我使用.html更新我的元素。重要的是,我不会从检索到的html代码中创建DOM元素,因为这会破坏脚本标记。是否可以先嵌入响应,然后加载包含相关代码的javascript文件。。。也许jquery可以使用deferrend…那真的不可能。外部JS已全部加载。这是一个函数调用,用于初始化页面上的内容-此函数接收一些非完全静态的参数,否则我不会在HTML中包含任何JS代码。是否可以先嵌入响应,然后加载包含相关代码的javascript文件。。。也许jquery可以使用deferrend…那真的不可能。外部JS已全部加载。这是一个函数调用,用于初始化页面上的内容,并且该函数接收一些参数,这些参数不是完全静态的,否则HTML中就不会有任何JS代码。