javascript元素.focus（）IE

因此，当用户双击div时，我希望使其可编辑，并将光标设置为双击的位置

html:

<div id="mydiv" class="cmydiv" ondblclick="fEdit(this, event)">haha brouhaha beeee lololol</div>

正如您所看到的，我使用IE的setTimeout调用focus（），但是它仍然不起作用！在所有其他浏览器中，我都可以看到div中的光标，该div现在是可编辑的，但在IE（版本8）中没有。发生了什么事

---

jsfiddle:

这似乎可以实现以下目的：

function fEdit(elem, e) {
    elem.contentEditable = "true";
    var range;
    if (document.selection) {
        range = window.document.selection.createRange();
        range.collapse();
        range.select();
    } else {
        range = window.getSelection();
        if (range.rangeCount > 0) range.collapseToStart();
    }
    setTimeout(function() { elem.focus(); }, 10);
    //elem.focus();
};

重要的一点是为IE调用range.select（）。range.collapse（）与为其他浏览器调用range.collapseToStart（）的功能相同。execCommand（“取消选择”）不是您想要的

---

更新的JSFIDLE:

在IE8中，我认为

元素不允许接收焦点。但可能有一个解决方法：。文章说你应该给你的

一个

tabIndex

属性。tabIndex是有意义的，我认为你需要这样做才能让canvas元素接收焦点。我尝试过将tabIndex设置为div，但在IE上仍然不起作用，它破坏了firefox中的功能，也就是tabIndex，光标不再可见。jsfiddle：与这个问题密切相关：@Brilliand我不太关心确切的位置，我只想IE在它变得可编辑后在div中显示光标。在IE中，它确实可以编辑，但没有光标/焦点，因此最好只运行一次，否则用户无法双击选择单词。此外，div周围的边框可能只有在div变得可编辑时才会出现（或者至少变得更明显），这样用户才可以看到某个地方发生了变化。否则，用户可能会觉得双击不起作用。

function fEdit(elem, e) {
    elem.contentEditable = "true";
    var range;
    if (document.selection) {
        range = window.document.selection.createRange();
        range.collapse();
        range.select();
    } else {
        range = window.getSelection();
        if (range.rangeCount > 0) range.collapseToStart();
    }
    setTimeout(function() { elem.focus(); }, 10);
    //elem.focus();
};