只有當我顯示它的容器時，我如何才能在<script></script>內執行代碼？

Question

我this代碼：

HTML

<a href="javascript:void(0);" id="showDiv">Show Agency</a> 

<div id="invisibleDiv"> 
    <script src="http://platform.linkedin.com/in.js" type="text/javascript"></script> 
    <script type="IN/CompanyProfile" data-id="1035" data-format="inline" data-related="false"></script> 
</div> 

jQuery的

$("#showDiv").click(function() { 
    $("#invisibleDiv").show(); 
}); 

CSS

#invisibleDiv 
{ 
    display:none; 
} 

當我加載網頁，我看到從外部源加載腳本，如果div被隱藏。腳本使用一些API調用並生成HTML/Javascript。

那麼，我正在尋找的是強制腳本被卸載，如果父母被隱藏;比，當我將顯示它（通過鏈接），在div中加載腳本。

我該怎麼辦？我會避免AJAX。

Answer 1

更新：

• DEMO：http://jsfiddle.net/HqeD2/

<a href="#" id="showDiv">Show Agency</a> 
<div id="invisibleDiv"> 
<script type="IN/CompanyProfile" data-id="1035" data-format="inline" data-related="false"></script> 
</div> 

$(function() { 
    $("#showDiv").click(function() { 
     $.getScript("http://platform.linkedin.com/in.js"); 
    }); 
}); 

Answer 2

你可以將它綁定到你的showDiv點擊函數，內聯腳本馬上被處理......我唯一能想到的其他事情就是讓腳本通過你不想要的ajax加載。

Answer 3

試試這個：

http://jsfiddle.net/sXJa6/6/

Answer 4

如果我理解正確，你只是想延遲第三方提供的任意腳本的運行？會有這樣的工作嗎？

<div id="invisibleDiv" style="display:none">Please wait while we load some stuff from Facebook...</div> 

$("#showDiv").click(function(){ 
    $("#invisibleDiv").show().load("http://facebook.com/whatever/andStuff"); 
}); 

有你無法預取的HTML內容的缺點，但我沒有看到任何其他方式。

編輯：好的，它看起來像你編輯的問題，我正在輸入這個......所以你控制invisibleDiv的內容，但你想延遲加載in.js？試試這個...

$("#showDiv").click(function(){ 
    $("#pleaseWaitDiv").show(); 
    $.getScript("http://platform.linkedin.com/in.js", function(){ 
     $("#pleaseWaitDiv").hide(); 
     $("#invisibleDiv").show(); 
    }); 
}); 

同樣，你必須讓用戶等待，而腳本下載，所以我除了pleaseWaitDiv

的更多編輯： 新建一個腳本節點，並追加了。

var scriptNode = $("<script></script>") 
    .attr("type","IN/CompanyProfile") 
    .attr("data-id","1035") 
    .attr("data-format","inline") 
    .attr("data-related","false"); 

$("#invisibleDiv").append(scriptNode); 
$.getScript("http://platform.linkedin.com/in.js", function(){ 
    $("#pleaseWaitDiv").hide(); 
    $("#invisibleDiv").show(); 
});