如何阻止iframe阻止我的JS?

时间:2012-06-15 08:08:42

标签: javascript html iframe pageload

我有一个页面同时使用unofficial github buttons和我使用此syntax highlighter突出显示的代码。

问题是,两个github按钮是iframe,它们都向api.github.com发出请求,有时可能需要一段时间才能加载。

当按钮正在加载时(并且chrome说“等待api.github.com”),语法高亮显示器的javascript无法执行。它在iframe完全加载之前不会执行,有时可能需要一段时间。

我更喜欢没有github按钮,并且我的代码突出显示比首先加载github按钮更快。我怎样才能做到这一点?

我尝试使用javascript异步加载按钮,但由于iframe中的javascript由于某种原因而无法执行,因此无法正常加载。

以下是我如何加载SyntaxHighlighter(在<head>中)

<script type="text/javascript" src="js/shCore.min.js"></script>
<script type="text/javascript" src="js/brushes.min.js"></script>
<script type="text/javascript">
SyntaxHighlighter.defaults['gutter'] = false;
SyntaxHighlighter.defaults['toolbar'] = false;
SyntaxHighlighter.all();
</script>

iframe HTML看起来像这样:

<iframe src="http://markdotto.github.com/github-buttons/github-btn.html?user=user&amp;repo=repo&amp;type=watch&amp;count=true&amp;size=large" allowtransparency="true" frameborder="0" scrolling="0" width="165px" height="30px"></iframe>
<iframe src="http://markdotto.github.com/github-buttons/github-btn.html?user=user&amp;repo=repo&amp;type=fork&amp;count=true&amp;size=large" allowtransparency="true" frameborder="0" scrolling="0" width="165px" height="30px"></iframe>

如何阻止按钮阻止我的JS?

3 个答案:

答案 0 :(得分:0)

你有没有尝试过jquery延迟。您可以在http://www.erichynds.com/jquery/using-deferreds-in-jquery/

找到示例

答案 1 :(得分:0)

您可以在使用javascript加载文档后分配iframe src。 这样你的页面只会加载查找,然后这些可能会占用他们想要的所有时间。

有些人喜欢:

<script>
function showbuttons()
{
  var path1 = "http://markdotto.github.com/github-buttons/github-btn.html?user=user&amp;repo=repo&amp;type=watch&amp;count=true&amp;size=large";
  var path2 = "http://markdotto.github.com/github-buttons/github-btn.html?user=user&amp;repo=repo&amp;type=fork&amp;count=true&amp;size=large";
  document.getElementById('frame1').src = path1;
    document.getElementById('frame2').src = path2;
}
</script>

HTML:

<body onload="showbuttons()">
<iframe id="frame1" allowtransparency="true" frameborder="0" scrolling="0" width="165px" height="30px"></iframe>
<iframe id="frame2" allowtransparency="true" frameborder="0" scrolling="0" width="165px" height="30px"></iframe>

答案 2 :(得分:0)

要阻止iframe出现在其他人的网站上,您可以使用此脚本

if(document.querySelector('html').ownerDocument.location.ancestorOrigins[0]==undefined==false){
    document.querySelector('html').innerHTML='hello plagiat web.....visit official web... visit here : '+document.querySelector('html').ownerDocument.URL;}