在iframe中只顯示一個div（javascript，jQuery ...）

首先讓我說我完全接受另一種方法的想法。在iframe中只顯示一個div（javascript，jQuery ...）

我和iframe這樣：

<div id="testloadlogin"> 
     <iframe src="../security/login.aspx" width="400" height="500" 
      scrolling="auto" frameborder="1"> 
     [Your user agent does not support frames or is currently configured 
     not to display frames. However, you may visit 
     <a href="../security/login.aspx">the related document.</a>] 
     </iframe> 
</div>

正在加載的頁面與IFRAME有一個div叫loginInnerBox。我只想顯示loginInnerBox及其中的所有內容。

有關如何做到這一點的任何想法？我正在考慮使用jquery或某種類型的javascript來刪除頁面加載的iframe上的所有內容，但不知道如何訪問該頁面，但...

只是爲了清楚我希望我的頁面上的所有內容iframe保持不變。我想要相當於說。$（'testloadlogin'）。load（'../security/login.aspx'#loginInnerBox）它只會得到loginInnerBox的html並將它放在testloadlogin div中。不過，我需要從iframe支持的其他頁面進行後端處理，但不需要Jquery加載。

在iframe中加載頁面的標記是

<body> 
    <div> 
    </div>....... 
    <div class="AspNet-Login" id="ctl00_CLPMainContent_Login1"> 
     <div id="loginInnerBox"> 
      <div id="loginCreds"> 
       <table> 
       </table> 
      </div> 
     </div> 
    </div> 
    <div> 
    </div>.... 
</body>

你需要更多的信息？

我想這一點，它沒有任何效果：

<div class="ui-corner-all" id="RefRes"> 
     <div id="testloadlogin"> 
     <iframe onload="javascript:loadlogin()" id="loginiframe" src="../security/login.aspx" 
      scrolling="auto" frameborder="1"> 
     [Your user agent does not support frames or is currently configured 
     not to display frames. However, you may visit 
     <a href="../security/login.aspx">the related document.</a>] 
     </iframe> 
     </div> 
    </div> 
    <script type="text/javascript"> 
     function loadlogin() { 
      $('<body>*', this.contentWindow.document).not('#ctl00_CLPMainContent_Login1').hide(); 
     } 
    </script>

來源

2010-11-03 kralco626

我不明白。「只顯示框」是什麼意思？你想要與其他內容發生什麼？關於iframe之外的內容呢？ – 2010-11-03 12:10:37

對不起。內容的其餘內容我想要消失的iframe。我希望保持完整的iframe內容。 – kralco626 2010-11-03 12:11:45

這取決於iframe中加載頁面的標記，如何操作，所以請顯示標記。 – 2010-11-03 12:26:58

$("iframe").contents().find("*:not(#loginInnerBox)").remove();

注意這隻能從同一個域中加載iFrame的工作（same origin policy）

編輯：也許這將刪除還有loginInnerBox的孩子。在這種情況下，你可以嘗試之前，克隆它：

var iframe = $("iframe").contents(), 
    loginBox = iframe.find("#loginInnerBox").clone(); 

iframe.find("*").remove(); 
iframe.append(loginBox);

類似的東西..

來源

2010-11-03 12:18:15 pex

希望他們會來自同一個域名。他們現在只是希望他們不會改變網站的域名。我正在測試。 – kralco626 2010-11-03 12:20:12

它沒有做任何事情。只是像以前一樣在iframe中顯示整個頁面。 – kralco626 2010-11-03 12:22:05

嗯..嘗試是否可以從iframe內容中刪除任何內容。如果'remove'不能在iframe上工作，你可以切換到'$（el）.hide（）'？ – pex 2010-11-03 12:29:45

一下添加到 -elememt：

onload="$('body>*',this.contentWindow.document).not('#ctl00_CLPMainContent_Login1').hide();"

它會藏起了身體的每一個孩子除了＃ctl00_CLPMainContent_Login1

如果＃ctl00_CLPMainContent_Login1包含多於登錄框，則必須使用pex發佈的使用clone（）的建議。

來源

2010-11-03 13:25:47

所以如果有登錄框裏面的div需要使用克隆嗎？在使用克隆時單擊iframe中的按鈕時會執行相同的服務器端代碼，因爲不使用克隆？ – kralco626 2010-11-03 21:16:29

javascript並不在乎服務器端代碼，而在另一方面，服務器wo'nt關心JavaScript。 – 2010-11-04 01:04:54

使用jQuery，您不僅可以加載URL的內容，還可以加載該URL中的特定CSS選擇器。這將是一個更清潔的方法。就像這樣。

$("#area").load("something.html #content");

通過CSS Tricks

來源

2012-07-23 07:30:17 Gourneau

在iframe中只顯示一個div（javascript，jQuery ...）

回答

相關問題