Jquery 加载元素页面适用于除视频之外的所有内容

Question

这是代码

$(function() {
    if(location.hash) $("#content_inload").load(location.hash.substring(1) + ' #content_inload'); 
    $("#nav a").click(function() {
        $("#content_inload").load(this.hash.substring(1) + ' #content_inload');
    });
});

由于某种原因，它将加载所有内容，但不会加载 jw 视频播放器。但是，如果我要求它加载整个页面而不仅仅是“#content_inload”，即使该页面没有标题部分、没有脚本并且仅是“#content_inload”内的内容，它也会加载视频。我只能假设JW播放器在内容顶部的底部添加了一行代码，但找不到该行是什么。

Answer 1

如果您看到关于 .load() 方法的 jquery 源代码，他们会这样做。

...
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(res.responseText.replace(rscript, ""))

        // Locate the specified elements
        .find(selector) :

    // If not, just inject the full result
    res.responseText 
);
...

如果提供了选择器（如您的情况），他们会删除脚本以避免 IE 中出现“权限被拒绝”错误。

您需要使用 jquery .get()

>类似的

$("#nav a").click(function() {
    $.get( this.hash.substring(1), function(response){
      var dummy = $('<div>').append( response ).find('#content_inload');
      $("#inload_container").html(dummy);
    } );
});

另请注意，当您将 #content_inload 插入自身时，我已使用 #inload_container 作为目标元素，实际上是重复的..

---

更新

在您发表评论后，我尝试了以下有效的方法

$("#nav a").click(function() {
    $.get( this.hash.substring(1), function(response){
      $("#inload_container").empty().append(response).find('>*:not(#content_inload)').remove();
    } );
});

似乎在内存中的 jquery 对象中创建脚本元素时可能会出现问题？ （无法确定原因）

在您的具体情况下，上述解决方案可以工作，但它不是很优雅，因为它会将 ajax 调用返回的所有内容添加到 DOM 中，然后过滤掉我们不想要的内容。

最好只更改您的实际视频页面（从 ajax 加载的）并执行正常的 .load() 没有过滤掉任何东西..