Check if contenteditable is supported in a Browser


So the plugin I am writing on contenteditable, I had to check if browser actually support this functionality or not.

So I read a few articles and I came to this conclusion that there are a few ways that you check support for contenteditable

Lets check out what those ways are

First way

First way is to use Modernizr framework and this is how you do it with Modernizr

Please correct me if I am wrong in stating above.

Second way

This is just a pure JavaScript way and we have been using this for ages (overstated :)) now

Here is how you can check it

isContentEditableSupported will have value true or false depending on if its supported or not


Third way

We can make use of jQuery in third way

let me show you how this is done. We will just create a tag and check if contenteditable property value is inherit, inherit is the default value of contenteditable

Once again isContentEditableSupported will have value true or false depending on if its supported or not

So as you can see that there are a few ways to detect support for this property.

There are some cases such as in Smartphone and Tablet browser that above test may return false positive so maybe its better to see what check reliably result in accurate output.

I hope that this helps

To make a correction to this post please leave your comments so that others can benefit.



Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.