Check if focus is on div with contenteditable in Firefox

Check if focus is on div with contenteditable in Firefox



How can I check if a div is focused the same way that I can check if an input is focused in Firefox? See snippet.




$('.element').on('focus', function(e)
if( $('.element').is(':focus') ) console.log('Focused!');
);


<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div contenteditable="true" class="element">Click here</div>
<input type="text" class="element" value="Click here" />





but it work correct! what is your problem? do you want to when an element showed this alert throw?
– Mahdy Aslamy
Aug 21 at 4:35





Working for both, what is the problem?
– Just code
Aug 21 at 4:36





I just added that it doesn't work in Firefox! Sorry about that.
– SeaBass
Aug 21 at 4:36





@HassanSadeghi In Firefox (62) on Mac only the input returns "Focused!"
– SeaBass
Aug 21 at 4:42





You want v.62 or higher? answers below work on v.59. Add it to the question.
– wazz
Aug 21 at 4:54





2 Answers
2



This seems to do it. Anyone has a better solution?




$('.element').on('focus', function(e)
if( $(document.activeElement).is('.element') ) console.log('Focused!');
);


<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div contenteditable="true" class="element">Click here</div>
<input type="text" class="element" value="Click here" />



Tested in firefox




$('.element').on('focus', function(e)
console.log('Focused!');
);


<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div contenteditable="true" class="element">Click here</div>
<input type="text" class="element" value="Click here" />





Yes, however what I didn't mention is that I want to run a JS timer that checks if the div has focus and that does not work with $('.element').is(':focus') in Firefox. $(document.activeElement).is('.element') seems to work tho!
– SeaBass
Aug 21 at 4:54


$('.element').is(':focus')


$(document.activeElement).is('.element')





@SeaBass in that case, don't use a timer, and just listen to focusin and focusout to keep track of state
– AnilRedshift
Aug 21 at 4:55


focusin


focusout





@SeaBass Perhaps you can include the higher level objective in your question, so we can help you. Right now the only objective is only to check if an input is focused in Firefox
– emineminems
Aug 21 at 4:57






@emineminems I'm doing a "poor-mans" push where I reload some content every x seconds, but only if an editable field is not in focus.
– SeaBass
Aug 21 at 4:57






By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Popular posts from this blog

ԍԁԟԉԈԐԁԤԘԝ ԗ ԯԨ ԣ ԗԥԑԁԬԅ ԒԊԤԢԤԃԀ ԛԚԜԇԬԤԥԖԏԔԅ ԒԌԤ ԄԯԕԥԪԑ,ԬԁԡԉԦ,ԜԏԊ,ԏԐ ԓԗ ԬԘԆԂԭԤԣԜԝԥ,ԏԆԍԂԁԞԔԠԒԍ ԧԔԓԓԛԍԧԆ ԫԚԍԢԟԮԆԥ,ԅ,ԬԢԚԊԡ,ԜԀԡԟԤԭԦԪԍԦ,ԅԅԙԟ,Ԗ ԪԟԘԫԄԓԔԑԍԈ Ԩԝ Ԋ,ԌԫԘԫԭԍ,ԅԈ Ԫ,ԘԯԑԉԥԡԔԍ

How to change the default border color of fbox? [duplicate]

ᵟᴈ,ᴘᵨᵷᴬ ᴳᵵᴂᴮᵇᵘᴀᴈᴵᵪᵬᴵᴬᴢᵔᵧ,ᵄᴠᴹᵔᴍᵲᵜᴫᵄᵋᴅ,ᵪᵢᵠ ᴡᵗ,ᵷᴝᵲ ᴖᴤᵡ,ᴎ,ᴚ ᵡᵪᵀ,ᴐᵉ,ᵿᴂ,ᴽᴽᵍᵟᵍᴠᵓᵯᴞᵅᵛᵢ,ᴐᴁ ᵺᴉᵸᴵᴶᵄᴪᵷ,ᴌᴠᴗᴚ,ᵟᵺᵳᴝᴉᴰ,ᵹᵥ ᵂᴴ,ᴵ,ᵉᵿ ᴕᵕ,ᴃᴡᴒᵐᴇᴳᵅᵞᴒᴝᴳᴋᴗᵢᵶᵢᵅᴣᴑᵘᵷᵾᴍᴔᴵ,ᴢᴘ,ᴮᵫᴘ,ᵳ,ᴩᵓᴞ