javascript - Contenteditable reset text color after foreColor has been used without resetting other styles - Stack Overflow

admin管理员组

文章数量:1201362

Changing the text color of text in a contenteditable div is easy - simply called document.execCommand("foreColor",false,"#FFF") to change text color to white.

However, I cannot find a way to reset this color back to its default value (or to the value of the parent element). document.execCommand("removeFormat",false,null) works perfectly, except that it will also remove any bold or italic styles, which is not what I want. Simply setting the color to black works, apart from if you have a link in the selection (which should stay the same color).

Is this possible?

Changing the text color of text in a contenteditable div is easy - simply called document.execCommand("foreColor",false,"#FFF") to change text color to white.

However, I cannot find a way to reset this color back to its default value (or to the value of the parent element). document.execCommand("removeFormat",false,null) works perfectly, except that it will also remove any bold or italic styles, which is not what I want. Simply setting the color to black works, apart from if you have a link in the selection (which should stay the same color).

Is this possible?

• javascript
• contenteditable

Share Improve this question Follow asked Oct 1, 2010 at 20:48 Nico BurnsNico Burns 17.1k1010 gold badges4242 silver badges5555 bronze badges

Add a comment  | 

2 Answers 2

Sorted by: Reset to default 17

I'm having success with the following:

document.execCommand("removeFormat", false, "foreColor");

Seems (so far) that removeFormat can be understood to remove only formatting created by a particular command.

Here's a partial answer, but I'm still looking for a solution for Chrome:

In IE9, you can use the following:

document.execCommand("foreColor",false,"")

In Firefox, you can use this:

document.execCommand("foreColor",false,"inherit")

But in Chrome, passing null/empty string does nothing, while passing 'inherit' results in setting the text color to "rgba(0, 0, 0, 0)" -- transparent black. Clearly this is a bug. I would love to see a more reliable cross-browser way to do this.

本文标签：