jQuery check if element is editable

Question

Problem

I have an editable div containing a few non-editable divs. If a user clicks somewhere I have to find out if he clicked in an area he can actually edit or not.

Question

Is there a way to check if an element is editable? Something like this:

$('my-element-selector').is(':editable')

(And no, the :editable selector is not working, just an example)

Answer 1

$('#mydiv').get(0).isContentEditable

https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement.isContentEditable

Answer 2

As far as i heard, there is no such selector called :editable in core jquery, Try to make use of the attribute selector at this context,

$('my-element-selector').is('[contenteditable="true"]')

DEMO

Answer 3

Try this

$( "div" ).click(function() {
if ( $( this ).hasClass( "editable" ) ) {

}
});

OR

if ( $( "#myDiv" ).is( ".editable" ) ) {

}

Answer 4

Give a specific class for editable div and check for class. For example :

 if ( $( "#DivId").hasClass( "Editable" ) ) {}

Another way :

if ( $( "#DivId" ).is( ".Editable" ) ) {

   }