javascript - 查看 ContentEditable div 是否有焦点

Question

我正在尝试检查一个 contenteditable div 是否有焦点，但我遇到了一些麻烦。到目前为止，这是我的代码:

if ($("#journal-content:focus")) {
    alert("Has Focus");
} else {
    alert("Doesn't Have Focus");
}

问题是，它总是返回“有焦点”，即使它没有。执行此操作的最佳方法是什么？

更新:这样做的原因是在插入新元素之前查看光标是否位于所需位置。否则，如果用户点击的最后一个地方是在标题中，那么当我用 Rangy 恢复选择并用新元素替换它时，它最终会出现在标题中。我需要一种方法来确定 contenteditable div 是否获得焦点/其中是否有光标，所以如果没有，我将简单地在末尾附加我要插入的元素。

更新 2:这是一个 JSFiddle 说明我的问题:http://jsfiddle.net/2NHrM/

Answer 1

尝试:

if ($("#journal-content").is(":focus")) {
    alert("Has Focus");
} else {
    alert("Doesn't Have Focus");
}

或者:

window.contenteditable_focused = false;

$("#journal-content").focus(function() {
    //alert("Has Focus");
    contenteditable_focused = true;
});
$("#journal-content").blur(function() {
    //alert("Doesn't Have Focus");        
    contenteditable_focused = false;
});

在执行脚本之前检查 contenteditable_focused。

或者:

if ($( document.activeElement ).is("#journal-content")) {
    alert("Has Focus");
} else {
    alert("Doesn't Have Focus");
}