隱藏iframe內的內容？

我有一個名爲iframe.html的文件。其中有代碼在下面，

<!DOCTYPE html> 
<html lang="eng"> 
    <head> 
     <meta charset="UTF-8"/> 
     <title>Pluign Development</title> 

     <script src="js/jquery-1.11.0.js" type="text/javascript"></script> 
    </head> 

    <body> 

     <iframe id="abc" src="test.html"></iframe> 
     <div id="sub">click</div> 
    </body> 

    <script src="js/script-22.js" type="text/javascript"></script> 
</html>

和我有test.html文件。其中有代碼在下面，

<!DOCTYPE html> 
<html lang="eng"> 
    <head> 
     <meta charset="UTF-8"/> 
     <title>Pluign Development</title> 

    </head> 

    <body> 

     <div id="red">prasanga karunanayake </div> 
    </body> 


</html>

這裏是js代碼什麼我都試過了，

(function($){ 

    var fire = { 
     init:function(){ 
      $('#sub') 
      .on('click', function(){ 
       $('#red', parent.document).css('display','none'); 
      }); 
     } 
    }; 
    fire.init(); 

}(jQuery));

這裏是我的情況。

我需要隱藏<div id="red">prasanga karunanayake </div>它位於test.html文件中。如果我點擊<div id="sub">click</div>然後隱藏test.html中的html內容。

我很困惑，你的幫助表示讚賞。

來源

2015-05-14 Prasanga

我懷疑隱藏的iframe本身是不可能的？ –

你的意思是你需要隱藏'

prasanga karunanayake

'點擊'

click

'而沒有別的？ –

試試這個$（'＃red'，window.parent.document）.css（'display'，'none'）; – talsibony

你試過

$('#sub') 
    .on('click', function(){ 
     $('iframe #red').css('display','none'); 
    });

編輯首先獲取事件時的iframe加載，然後創建一個事件處理程序捕獲到#sub DIV點擊，終於發現在加載IFRAME紅和隱藏

$(function(){ 
      var f=$('#abc') 
      f.load(function(){ 
        $("#sub").click(function(){ 
        f.contents().find('#red').hide(); 
        }); 

      }) 
     })

來源

2015-05-14 08:35:10 Lukesoft

看到編輯答案 – Lukesoft

謝謝你的答案，但這裏是我需要隱藏的HTML內容的東西。如果我點擊div。 – Prasanga

對不起，檢查編輯 – Lukesoft

-2

無法隱藏什麼在iframe本身，而是可以通過更改SRC，像這樣隱藏的iframe：

$('#sub') 
     .on('click', function(){ 
      $('#abc').attr('src',''); 
     });

來源

2015-05-14 08:37:41

您可以使用.contents()這樣：

$('#abc').contents().find('#red').hide();

另一件事是，當你已經包裹在它運行的頁面響應獲取瀏覽器的關閉你的代碼。因此，這種代碼更改可能無法工作。

相反，我建議你把一個DOM準備塊也是這樣：

(function($){ 
    $(function(){ // <---add this block from here to 
     var fire = { 
     init:function(){ 
      $('#sub').on('click', function(){ 
       $('#abc').contents().find('#red').hide(); 
      }); 
     } 
     }; 
     fire.init(); 
    }); //<----here 
}(jQuery));

來源

2015-05-14 08:37:58 Jai

謝謝。加工。 – Prasanga

我已經嘗試了所有的答案以上，但沒有什麼似乎工作，但我發現這樣的方式：

放一個div內的iframe，並隱藏在點擊

<!DOCTYPE html> 
<html lang="eng"> 
    <head> 
     <meta charset="UTF-8"/> 
     <title>Pluign Development</title> 

     <script src="jquery-1.11.3.min.js" type="text/javascript"></script> 
     <script src="js.js" type="text/javascript"></script> 
    </head> 

    <body> 
     <div class="toHide"> 
      <iframe id="abc" src="test.html"></iframe> 
     </div> 
     <div id="sub">click</div> 

    </body> 


</html>

並隱藏它的代碼是：

$(document).ready(function(e) { 
    $('#sub').click(function(){ 
     $(".toHide").html(''); 
    }); 

    $('#sub').click(); 
});

或

$(document).ready(function(e) { 
    $('#sub').click(function(){ 
     $(".toHide").css({"display":"none"}); 
    }); 

    $('#sub').click(); 
});

也請注意，你把JS文件在身體之外，你可以把它的body標籤內或像我一樣

來源

2015-05-14 09:01:17

頭如果裏面加載頁面iframe與父框架不在同一個域中，那麼使用JavaScript或CSS是不可能的。

這是在Web瀏覽器上實施的一項安全功能，用於防止XSS（跨站點腳本）。

來源

2017-10-12 03:27:00

隱藏iframe內的內容？

回答

相關問題