页面上 iframe 中的 jQuery 不起作用答案

【问题标题】：jQuery in iframe on page doesn't work页面上 iframe 中的 jQuery 不起作用
【发布时间】：2017-08-12 19:19:22
【问题描述】：

我在使附加的 jQuery 在 iframe 上的页面中工作时遇到了一些麻烦。我要么得到 p>

未捕获的错误：

或

未捕获的引用错误：$ 未定义

以下部分负责将脚本附加到 iframe 上显示的页面：

var simpleScriptTest = '<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js">'+
'</script>'+
'<script>'+
  '$("a").hover(function(){'+   
  ' $(this).css("background-color", "rgb(255, 255, 0)");'+
  '});'+
'</script>';

$('iframe').on("load",function(){
  loadedIframe = true;
  $("iframe").contents().find('script').remove();
  $("iframe").contents().find('noscript').remove();
  $("iframe").contents().find("head").append(simpleScriptTest);
  console.log('load the iframe');
});

谁能解释为什么会发生这种情况以及我如何解决这个问题？

【问题讨论】：

“in my facebook page's copy in iframe” – 你是什么意思？
@CBroe 我的意思是我有完整的 facebook 页面副本可以显示在同一域的 iframe 中。
“fb 页面的完整副本”？为什么？做什么的？这甚至不应该工作......
@luschn，这行得通（我得到 html、css、js 等等，你在加载 fb 页面时得到的一切），为什么不重要。这不是问题...
“为什么”总是很重要，因为也许会有另一种（更好的）方法；）

标签： javascript jquery html facebook iframe

【解决方案1】：

您似乎在加载 jquery $ 之前调用它。这个：

$('iframe').on("load",function(){
  loadedIframe = true;
  $("iframe").contents().find('script').remove();
  $("iframe").contents().find('noscript').remove();
  $("iframe").contents().find("head").append(simpleScriptTest);
  console.log('load the iframe');
});

jquery 的 $('iframe') 在你实际加载 jquery (append(simpleScriptTest)) 到你的页面之前被调用。所以这就是为什么你的页面不理解 $?还是您在其他地方已经有 jquery 链接？

【讨论】：

我说的是 iframe 中的一个页面