Jquery .load 未加载 javascript 或 flash答案

【问题标题】：Jquery .load not loading javascript or flashJquery .load 未加载 javascript 或 flash
【发布时间】：2011-08-23 03:31:13
【问题描述】：

我正在尝试使用 Jquery 将页面“/test/2”加载到主页上的 div 中。我设置了 2 个版本，一个使用 iframe，另一个使用 jQuery 加载功能。当我使用 ajax 加载功能时，页面的 youtube 部分（我使用 java 脚本加载）显示“您需要 Flash 播放器 8+ 和启用 JavaScript 才能观看此视频。” ;然而。当我使用 iFrame 时，它会完美加载。

这是我用来加载页面的代码（使用 jquery）：

<script> $(document).ready(function(){
$('#theList li a').click(function(){
    $('#containerDiv').load($(this).attr('href'));
    return false; 
}); }); </script>

这是我用来在“/test/2”页面上加载 youtube 的代码，该代码直接来自 youtube 的 API 文档。

<div id="ytapiplayer"> 
  You need Flash player 8+ and JavaScript enabled to view this video.
</div> 
<script type="text/javascript"> 
      // <![CDATA[

      // allowScriptAccess must be set to allow the Javascript from one 
      // domain to access the swf on the youtube domain
      var params = { allowScriptAccess: "always", bgcolor: "#cccccc" };
      // this sets the id of the object or embed tag to 'myytplayer'.
      // You then use this id to access the swf and make calls to the player's API
      var atts = { id: "myytplayer" };
      swfobject.embedSWF("http://www.youtube.com/v/{{video.video_id}}?border=0&amp;autoplay=1;controls=0;hd=1;enablejsapi=1&amp;playerapiid=ytplayer",
                         "ytapiplayer", "680", "380", "8", null, null, params, atts);
      //]]>
    </script>

奇怪的是，它可以完美地与普通的 youtube 嵌入和 iframe 一起使用，但不能与 jQuery 加载功能一起使用。我可以补充一点，我对 jQuery 比较陌生，所以我的加载函数可能存在我不知道的问题。

编辑：这似乎是导致问题的原因（即我得到一个 Uncaught ReferenceError: google is not defined）。在我尝试加载的文件中，我有：

<script src="//www.google.com/jsapi"></script> 
<script> google.load("swfobject", "2.1"); </script>

创建 youtube 对象需要它。仍然不知道为什么它不会加载。

【问题讨论】：

您能否验证脚本是否已添加到您的 div 中？是否有任何 javascript 错误？
我在尝试 jQuery 后收到此错误 - 但根据 chrome，它似乎从 .load Uncaught ReferenceError: google is not defined (anonymous function):2 f.e.extend 获取所需的所有数据.globalEvaljquery.js:16 f.e.extend.globalEvaljquery.js:16 bmjquery.js:16 f.e.extend.eachjquery.js:16 f.fn.extend.domManipjquery.js:17 f.fn.extend.appendjquery.js:17 f .fn.extend.htmljquery.js:17 f.fn.extend.load.f.ajax.completejquery.js:18 f.extend._Deferred.e.resolveWithjquery.js:16 wjquery.js:18 f.support.ajax .f.ajaxTransport.send.djquery.js:18
感谢这条评论，我能够追查到错误。谢谢！我刚刚在我的父页面中包含了似乎导致问题的 2 个文件 - 我假设 jQuery 在您尝试从外部源加载时不喜欢它？无论如何，谢谢你为我指明了正确的方向。

标签： jquery load youtube

【解决方案1】：

jQuery 的加载函数会去除脚本标签..

查看这个相关的 SO 问题 jquery load() strips script tags - workaround?

【讨论】：

谢谢，我实际上可以通过在我的父页面中包含脚本加载来解决这个问题。

【解决方案2】：

实现此目的的另一种方法是使用get() 而不是load()，并在success 回调中创建内容。在这个例子中，服务器只返回视频 id，而不是 div 和脚本：

$(document).ready(function() {
    $('#theList li a').click(function() {
        event.preventDefault();
        $.get($(this).attr('href'), { }, function(data) {
            $('#containerDiv').append('<div id="ytapiplayer">You need Flash player 8+ and JavaScript enabled to view this video.</div>');
            var atts = { id: "myytplayer" };
            swfobject.embedSWF("http://www.youtube.com/v/" + data + "?border=0&amp;autoplay=1;controls=0;hd=1;enablejsapi=1&amp;playerapiid=ytplayer",
                     "ytapiplayer", "680", "380", "8", null, null, params, atts);
        });
    });
});

【讨论】：