YUI 리치 크롬

의 텍스트 편집기와 동일 출처 정책은 내가 YUI 3 서식있는 텍스트 편집기를 사용하여 실험을 내가 이해하지 못하는 사건 건너 온거야 :YUI 리치 크롬

나는 편집 내부에 서로 다른 기원에서 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>

구글은 크롬 20 : iframe을 편집

파이어 폭스 13 : 여기

코딩 예제입니다 편집 할 수 없습니다 iframe이이

출처

2012-07-14 toberndo

YUI 서식있는 텍스트 편집기를 사용하여 편집 가능한 영역은 iframe을 만들고 문서의 디자인 모드을 에으로 설정합니다. 즉,이 iframe 및 모든 자손이 편집 가능한 모드에 있음을 의미합니다. 편집 가능한 영역에 다른 iframe을 삽입하면이 속성을 상속하며 원본과 관계없이 편집 할 수 있습니다.

따라서 YUI 텍스트 편집기가 삽입 된 iframe의 DOM을 어떻게 든 조작한다는 가정은 올바르지 않습니다. 자바 스크립트가 포함되어 있지 않으며, 편집 가능한 다른 필드 (예 : 텍스트 영역 또는 contenteditable 속성이있는 요소)와 같은 사용자 상호 작용입니다.).

출처

2012-07-19 08:40:53 toberndo

YUI 리치 크롬

답변

관련 문제