YUI富文本編輯器和同源策略在Chrome

我與YUI 3富文本編輯器實驗和跨越的事件，我不明白傳來：YUI富文本編輯器和同源策略在Chrome

當我注入不同來源的iframe的編輯內區域，則此iframe的內容可以編輯爲任何其他內容。我可以將光標放入iframe區域，例如刪除字符。

這種情況只發生在Chrome瀏覽器，Firefox不能編輯iframe。儘管與YUI文本編輯器的頁面不同，但內部iframe的DOM可以如何操作？

這裏的例子編碼：

<html> 
    <head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
    <script src="http://yui.yahooapis.com/3.5.1/build/yui/yui-min.js"></script> 
    <script> 
    YUI().use('editor-base', function(Y) { 
     var editor = new Y.EditorBase({content: '<strong>This is <em>a test</em></strong><strong>This is <em>a test</em></strong> '}); 
     //Add the BiDi plugin 
     editor.plug(Y.Plugin.EditorBidi); 
     //Focusing the Editor when the frame is ready.. 
     editor.on('frame:ready', function() {this.focus();}); 
     //Rendering the Editor. 
     editor.render('#editor'); 
    }); 
    </script> 
    <script> 
    function inject() { 
     var ifr = $('<iframe/>', { 
     style: 'display: block; width: 300px; heigth: 200px;', 
     src: 'http://demo.yarkon.de', 
     frameBorder: 0, 
     scrolling: 'no' 
     }); 
     $('#editor').find('iframe').contents().find('body').append(ifr); 
    } 
    </script> 
    </head> 
    <body> 
    <button onclick='inject()'>Inject</button> 
    <div id="editor"></div> 
    </body> 
</html>

谷歌Chrome瀏覽器20：iframe是編輯

火狐13：iframe中不可編輯

來源

2012-07-14 toberndo

YUI富文本編輯器創建可編輯區域的iframe和將文檔的designMode設置爲，並將其設置爲。這意味着這個iframe及其所有後代都處於可編輯模式。如果將另一個iframe注入到可編輯區域，它將繼承此屬性並且也是可編輯的，與其來源無關。

因此，假設YUI文本編輯器以某種方式操縱注入的iframe的DOM是不正確的：沒有涉及JavaScript，它純粹是像任何其他可編輯字段一樣的用戶交互（如textarea或具有contenteditable屬性的元素）。

來源

2012-07-19 08:40:53 toberndo

YUI富文本編輯器和同源策略在Chrome

回答

相關問題