execCommand가 유효하지 않은 html을 만들었습니다

응용 프로그램에 대한 간단한 RTE를 작성하고 있습니다. 너무 복잡하지 않아도되므로 execCommands를 사용하는 것이 최선의 해결책 일 수 있다고 생각했습니다. 그러나 잘못된 HTML을 만드는 명령으로 문제가 발생했습니다. 여기에 내가 사용하고있는 자바 스크립트가 무엇인지에 대한 통찰력이있어 크게 감사 할 것입니다.execCommand가 유효하지 않은 html을 만들었습니다

$('.turnEditOn').live('click',function(){ 
     richTextEditor.document.designMode = 'ON'; 
     $('#richTextEditor').focus(); }); 
    $('#bold').live('click',function(){ 
     richTextEditor.document.execCommand('bold',false,null); 
     $('#richTextEditor').focus(); }); 
    $('#underline').live('click',function(){ 
     richTextEditor.document.execCommand('underline',false,null); 
     $('#richTextEditor').focus(); }); 
    $('#italic').live('click',function(){ 
     richTextEditor.document.execCommand('italic',false,null); 
     $('#richTextEditor').focus(); });

출처

2012-05-04 BigLig

무엇 Rich Text Editing in MDN 읽기'richTextEditor' 수 변수 이자형. iframe 창 객체에 대한 포인터입니까? '$ ('# richTextEdito')'와'$ ('# richTextEditor')는 무엇입니까? 같은 대상 (오타)입니까? jQuery 객체'$ ('# richTextEditor')'는 richTextEditor 변수와 동일한 객체를 가리 킵니까? –

예, $ ('# richTextEditor')는 동일한 객체 여야합니다. ID가 richTextEditor 인 iframe입니다. – BigLig

제작하는 HTML에 어떤 문제가 있습니까? –

HTML :

<div id="turnEditOn" class="command">on</div> 
<div id="bold" class="command"><b>B</b></div> 
<div id="italic" class="command"><i>I</i></div> 
<div id="underline" class="command"><u>U</u></div> 
<div class="command" onclick="alert(document.getElementById('richTextEditor').contentDocument.body.innerHTML);">Show HTML</div> 
<br/> 
<iframe id="richTextEditor" style="width:500px;height:300px;"></iframe>

JAVASCRIPT + jQuery를 (onDomReady) :

var richTextEditor=document.getElementById("richTextEditor"); 
$('#turnEditOn').live('click',function(){ 
    richTextEditor.contentDocument.designMode = 'ON'; 
    richTextEditor.contentDocument.body.contentEditable=true; 
    // Switch FireFox RTE execCommand engine to work in same manner as IE 
    try{richTextEditor.contentDocument.execCommand('styleWithCSS',false,false);} 
    catch(e){} 
    richTextEditor.focus(); 
}); 
$('#bold').live('click',function(){ 
    richTextEditor.contentDocument.execCommand('bold',false,null); 
    richTextEditor.focus(); 
}); 
$('#underline').live('click',function(){ 
    richTextEditor.contentDocument.execCommand('underline',false,null); 
    richTextEditor.focus(); 
}); 
$('#italic').live('click',function(){ 
    richTextEditor.contentDocument.execCommand('italic',false,null); 
    richTextEditor.focus(); 
});

예 : http://jsfiddle.net/d2L2A/

에 대한

출처

2012-05-04 06:19:29

execCommand가 유효하지 않은 html을 만들었습니다

답변

관련 문제