javascript - how refocus when insert image in contenteditable DIVs in IE?

Question

There is a div: <div contenteditable="true"></div> in IE(7,8,9), then I click a button to insert an image with using the document.execCommand('insertImage') method. Then the image was inserted. Until now there is no problem. But the inserted image is selected with resizable handlers. How could I cancel the selection and refocus behind the image? Thanks.

$button.click(function(){ document.execCommand("insertImage",false,'url'); });

Answer 1

用更简单的代码更新

这是一些讨厌的代码来做到这一点。在其他浏览器中，它似乎无论如何都可以工作，因此可以按原样使用以下内容。

演示：http: //jsfiddle.net/timdown/mr7Ac/6/

代码：

function insertImage() {
    var sel = document.selection;
    if (sel) {
        var textRange = sel.createRange();
        document.execCommand('insertImage', false, "someimage.png");
        textRange.collapse(false);
        textRange.select();
    } else {
        document.execCommand('insertImage', false, "someimage.png");
    }
}

Answer 2

尝试这样的事情（仅限 IE）：

function insertImage(){
    if(document.selection){
        var sel=document.selection;
        var range=sel.createRange();
        var amount=(document.addEventListener)?2:1;
        document.execCommand('insertImage', false, 'url');
        range.move('character',amount);
        range.select();
    }
    return;
}