अगर 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"); 
} 

या: अपनी स्क्रिप्ट लागू करने से पहले contenteditable_focused के लिए

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

चेक।

या:

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

Answer 2

आप इस

if ($("#journal-content").is(":focus")) { 
... 

हो सकता है कि कोशिश कर सकते हैं अगर आप हमें बता देंगे आप क्या हासिल करना है कि हम एक और अधिक मदद की हो जाएगा कोशिश कर रहे हैं। इस बीच, आप यहां पढ़ लिया है कर सकते हैं: http://api.jquery.com/focus-selector/।

Answer 3

क्या इस बारे में ?:

if (document.activeElement.isContentEditable) { 
... 
} 

मैं कितनी अच्छी तरह ब्राउज़र समर्थन नहीं जानते के लिए इस है, लेकिन कम से कम Chrome और Firefox यह समर्थन करते हैं।

Answer 4

शुद्ध जावास्क्रिप्ट के लिए आप एक से अधिक contenteditable तत्वों है जब:

सीएसएस और मार्कअप टुकड़ा

टुकड़ा चल रहा है और या तो तत्व दबाने की कोशिश करो के लिए विशुद्ध रूप से है। बाहर

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

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

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