ExecCommand不断线

Question

使用基于selection / key command的WYSIWYG编辑器。效果很好除了..。

与所有其他的关键命令，它切换特定的风格I，打击等开关。

使用execCommand('bold')，它不会取消文本的粗体。这很令人沮丧。每个浏览器都是一样的。

这是密码。

$('body').on('keydown', '.element_content, .element_content_subhead', function(e) { 

if(e.ctrlKey){

        //bold -- key 'B'
        if(e.which == 66){
            $sel = $.trim(document.getSelection().toString());
            if($sel == ''){
                alert('Please select some text to bold');
            }
            else{
                document.execCommand('bold', false, null);
            }
        }
       }

});

Answer 1

这是我的答案。

因为我使用的是一种非标准字体(ClanWeb)，所以b的粗体类型在浏览器中不能很好地工作。所以在我的CSS中，我有b{字体族:ClanWeb-粗体；字体重:普通！重要；}

这对于粗体类型来说很好，但是如果标签没有正常的行为，execCommand就不会触发；在CSS中没有字体大小:粗体。

所以这是我的密码来解开它。

  //bold -- key 'B'
    if(e.which == 66){
        $sel = $.trim(document.getSelection().toString());

        var parentEle = window.getSelection().getRangeAt(0).commonAncestorContainer;
        parentEle = parentEle.parentNode;


        if($sel == ''){
            alert('Please select some text to bold');
        }
        else if(parentEle.tagName == 'B'){
            parentEle.id='unbold1'; 
            $('#unbold1').contents().unwrap();
        }
        else{
            document.execCommand('bold', false, null);
        }
    }

Answer 2

在我的例子中，问题出现在“字体:继承”引导样式中。摘要:如果你在使用document.execComand时遇到“un头”或“unitalic”的问题，试着删除所有的css样式并检查您的编辑器--在此之后，它应该可以正常工作。