Javascript execCommand创建无效的html

Javascript execCommand创建无效的html,javascript,execcommand,Javascript,Execcommand,我正在为一个应用程序创建一个简单的RTE,它不需要太复杂,所以我认为使用execCommands可能是最好的解决方案。然而,我遇到了麻烦,因为这些命令创建了无效的HTML。这是我正在使用的javascript,如果您能深入了解造成这种情况的原因,我们将不胜感激 $('.turnEditOn').live('click',function(){ richTextEditor.document.designMode = 'ON'; $('#richTextEd

我正在为一个应用程序创建一个简单的RTE,它不需要太复杂,所以我认为使用execCommands可能是最好的解决方案。然而,我遇到了麻烦,因为这些命令创建了无效的HTML。这是我正在使用的javascript,如果您能深入了解造成这种情况的原因,我们将不胜感激

    $('.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();   });
HTML:

例如:


阅读什么是
richTextEditor
变量。是指向iframe窗口对象的指针吗?什么是
$('richTextEdito')
$('richTextEditor')
?是相同的对象(打字错误)?jQuery对象
$('#richTextEditor')
指向与
richTextEditor
变量相同的对象?是的,应该是$('#richTextEditor'),它们是相同的对象。这是一个id为richTextEditor的iframe。它生成的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>
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();
});