我有一个页面同时使用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&repo=repo&type=watch&count=true&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&repo=repo&type=fork&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="165px" height="30px"></iframe>
如何阻止按钮阻止我的JS?
答案 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&repo=repo&type=watch&count=true&size=large";
var path2 = "http://markdotto.github.com/github-buttons/github-btn.html?user=user&repo=repo&type=fork&count=true&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;}