使頁面啓動時iFrame無法加載

因此，我的網站有一大堆加載網站時加載的iFrame，但它們都隱藏起來，直到他們點擊一個按鈕來顯示它們。使頁面啓動時iFrame無法加載

問題是所有的iframe都一次加載，所以它的資源很重。我希望框架只在點擊按鈕時實際加載，並且可能在再次單擊按鈕時將其卸載以隱藏它們。

這裏是我當前的代碼只是I幀的一個：

<li data-value="iconchange"><img src="modules/icons/icons/calculator.png" width="65" onclick = "calcShow()" class="calculator"></li> &nbsp;

這裏是腳本，使其隱藏推出

<script type="text/javascript"> 
function calcShow() { 
    var calc = document.getElementById('calcShow'); 
    if (calc.className == 'show') { 
    calc.className = 'hide'; 
    } 
    else if (calc.className == 'hide') { 
    calc.className = 'show'; 
    } 
} 
</script>

然後用DIV的包括

<div id="calcShow" class="hide"><br><br><br> 
     <?php 

         include("modules/calc/calc.html"); 
     ?> 
     </div>

來源

2017-08-30 Dalton Metzler

<iframe src="" class="iframe_class" />

on cli CK功能

$('.iframe_class').attr('src', 'http://url.some.thing')

來源

2017-08-30 19:38:59 pheaselegen

好，所以你要加載上按一下按鈕的iframe下面是一個例子嘗試這樣的事情

<div id="iframeContainer"></div> 
<input type="btn" clas="btn btn-default" value="Click Me"/>

，並在劇本方面

<script> 
$(function(){ 
$('#btn').on('click', function (e) { 
if(!$('#iframeContainer').length) 
{ 
$('<iframe>', { 
    src: 'Your link', 
    width:'1062', 
    height: '600', 
    id: 'myFrame', 
    frameborder: 0 
    }).appendTo('#iframeContainer'); 
}); 
} 
else 
{ 
if(!$('#iframeContainer').hasClass('hidden')) 
    { 
    $('#iframeContainer').addClass('hidden') 
    } 
else 
    { 
    $('#iframeContainer').removeClass('hidden') 
    } 
} 
}) 
</script>

來源

2017-08-30 19:45:34

你應該更喜歡這種解決方案使用空的src-Tag解決方案。 – iquellis

你能告訴我一個關於如何用我上面提供的代碼實現的例子嗎？我有點困惑。這是一張圖片是他們點擊的不是一個按鈕。非常感激。 –

花花公子所有你需要做的是1.give img一個id 2創建一個空的div，這樣你就可以把你的iframe放在那裏 –

使頁面啓動時iFrame無法加載

回答

相關問題