Sehen Sie, wenn ContentEditable div-Element den Fokus hat

Versuche ich zu überprüfen, ob oder nicht eine contenteditable div-Element den Fokus hat, aber ich habe einige Schwierigkeiten. Hier mein code bisher:

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

Das problem ist, es ist immer die Rückkehr "den Fokus Hat", auch wenn er nicht. Was ist der beste Weg zu gehen über das tun dies?

Update: Der Grund dafür ist, um zu sehen, ob oder nicht Sie den cursor in die gewünschte Position vor das einfügen des neuen Elements. Ansonsten, wenn der Letzte Ort, den der Benutzer geklickt wurde, in die Kopfzeile, wenn ich dann bei wiederherstellen die Auswahl mit Feingliedrig und ersetzen Sie es mit einem neuen element, landet es in der Kopfzeile. Ich brauche einen Weg, um herauszufinden, wenn das contenteditable div ausgerichtet ist/hat Sie den cursor in es, so, wenn nicht, werde ich einfach anfügen das element ich das einfügen am Ende.

Update 2: Hier ein JSFiddle zur Veranschaulichung meines Problems: http://jsfiddle.net/2NHrM/

Check out my update unter Oder:
Hast du jemals eine Lösung finden?
Ich habe aktualisiert die Geige mit @iambriansreed die Antwort von unten, so dass es funktioniert.

InformationsquelleAutor Adam | 2012-03-30

Versuchen:

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

Oder:

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;
});

Check für contenteditable_focused vor dem ausführen der Skripts.

Oder:

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

Hmm, dass macht das Gegenteil, gibt immer "nicht konzentrieren"...
Dann ist es nicht konzentrieren.
...aber das tut es. Direkt danach bin ich mit Feingliedrige um die Auswahl zu speichern, das funktioniert Prima.
Das Letzte ist am besten.
Das problem ist, durch die Zeit, die der button angeklickt wird das element hat bereits den Fokus verloren.
Hier ist das problem das ich habe: jsfiddle.net/2NHrM

InformationsquelleAutor iambriansreed

Für Reine JavaScript-wenn Sie mehrere contenteditable Elemente:

Überprüfen document.activeElement.id oder document.activeElement.isContentEditable.

Beispiel:

JS:

function isFocused() {
  if (document.activeElement.id === "journal-content") {
    alert("Focused!");
  } else {
    alert("Not focused :(");
  }
}

CSS:

#journal-content {
  background-color: #eee;
}
#not-journal-content {
  background-color: #ccc;
}

HTML:

<div id="journal-content" contenteditable="true" onclick="isFocused()">Journal Content</div>
<div id="not-journal-content" contenteditable="true" onclick="isFocused()">Not Journal Content</div>

InformationsquelleAutor evelynhathaway

4

Was ist das?:
```
if (document.activeElement.isContentEditable) {
...
}
```
Ich weiß nicht, wie gut die browser-Unterstützung für diese ist aber zumindest Chrome und Firefox unterstützt.
- Würde das überhaupt funktionieren mit mehreren contentEditable Elemente.
InformationsquelleAutor Riesling
0

Können Sie versuchen, diese
```
if ($("#journal-content").is(":focus")) {
...
```
Vielleicht, wenn Sie sagen uns, was Sie versuchen, zu erreichen, werden wir von einem mehr helfen.
In der Zwischenzeit können Sie haben, Lesen Sie hier: http://api.jquery.com/focus-selector/.
- Alrighty werden, aktualisiert mein original-Beitrag mit einer Erklärung, was ich bin versucht zu tun. ( Ich habe versucht, Eure und es scheint nicht zu funktionieren).
- Wenn Sie Folgen Sie den link, den ich gepostet habe siehst du das: Wenn Sie auf der Suche für das aktuell fokussierte element, $( document.activeElement ) empfängt es, ohne zu suchen das ganze DOM-Baum.
InformationsquelleAutor Ilia Frenkel

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.