做一個iframe智能？

下面的代碼的想法是它有一個iframe（這是必要的，因爲應用程序有這個html結構）。當父窗口body元素具有類'IntelligenceEnabled'時，iframe將激活所有'a'標記名的行爲（「我是聰明的！」）;並且當該類不存在時，iframe上的鏈接將自動禁用。做一個iframe智能？

問題是：代碼運行良好，但有時當用戶在切換後（禁用/啓用）在iframe中點擊「showMessage」鏈接時，這些鏈接會重定向到url（Facebook，yahoo，google ...）沒有顯示消息。或者相反的效果，信息會顯示出來。

我在做什麼錯了？（兩者是相同的網域iframe和父窗口上）

<html> 
<script type="tex/javascript" src="/js/jquery-1.9.1.min.js"></script> 
<script> 
$(document).ready(function() { 

    $("body.IntelligenceEnabled #IamIntelligent").on('load', function() { 
     $("body.IntelligenceEnabled #IamIntelligent").contents().delegate('.showMessage', 'load', function() { 
      alert("I'am intelligent"); 
      return false; 
     }); 
    }); 

    $('#enableIntelligence').click(function() { 
     $('body').addClass('IntelligenceEnabled'); 
     return false; 
    }); 

    $('#disableIntelligence').click(function() { 
     $('body').removeClass('IntelligenceEnabled'); 
     return false; 
    }); 

}); 
</script> 
<body> 
<iframe id="IamIntelligent" src="/foo.html"></iframe> 
<a href="#" id="enableIntelligence">Enable my intelligence!</a> 
<a href="#" id="disableIntelligence">Make me gross!!!</a> 
</body> 
</html>

（/foo.html）

<html> 
<body> 
<a href="http://www.google.com" class="showMessage">Google</a> 
<a href="http://www.facebook.com" class="showMessage">Facebook</a> 
<a href="http://www.yahoo.com" class="showMessage">Yahoo</a> 
<a href="http://www.microsoft.com" class="showMessage">Microsoft</a> 
</body> 
</html>

來源

2013-03-26 Cristian David Jimenez Duarte

如果父框架能夠在iframe來檢查內容，那麼想象一下，當你瀏覽會發生什麼「www.awesomesite.com」中嵌入一個iframe來www.yourbank.com您已經登錄在不同的選項卡上。 – SecurityMatt 2013-03-26 05:37:38

^相關用戶名 – nathancahill 2013-03-26 06:01:50

U可以不委託事件iframe的負載內容等

$("body.IntelligenceEnabled #IamIntelligent")

這甚至沒有執行。

使用下面的代碼來獲得您的功能。

$("#IamIntelligent").on('load', function() { 
    $("#IamIntelligent").contents().delegate('.showMessage', 'click', function(e) { 
     if($(document.body).hasClass("IntelligenceEnabled")) { 
      alert("I'am intelligent"); 
      return false; 
     } 
    }); 
});

來源

2013-03-26 06:16:34 Sandeep

是的，這是解決方案！但我對此表示懷疑：例如，當您在CSS中編寫規則時，如body.IntelligenceEnabled {background-color：red; }和body {background-color：white; }你知道，背景會自動改變，而不使用IF（驗證），我正在嘗試的是：像CSS一樣。也許問題或想法是：只有在IntelligenceEnabled將出現在主體類中時，如何執行代碼？ – 2013-03-26 06:25:48

Actualy在你的情況下'onload'函數在頁面被加載時不被調用，因爲$（「body.IntelligenceEnabled #IamIntelligent」）'不存在，並且在添加'.IntelligenceEnabled'之後不會進行調用。 CSS Selector引擎的工作方式與AFAIK不同。 – Sandeep 2013-03-26 06:44:31

做一個iframe智能？

回答

相關問題