Alternative for execCommand ('underline');

Question

Ok, some guys will know what I mean and edit their question, but they did it wrong.

The best explanation:

You have contenteditable divwith text This is a Test String.. If you use now execCommand('underline')on Test String, you get This is a <u>Test String</u> if you use now execCommand('strikethrough')on is a Test, you get This <s>is a <u>Test</u></s><u>String</u>, THIS is correct.

So, in HTML5 <u>and <s>are deprecated. For the first execCommandyou can use surroundContents()with <span style="text-decoration:underline;">. If now you use surroundContets()for the second execCommand, you get BAD_BOUNDARYPOINTS_ERR.

The thing I want is a function that works in this case as execCommand, but with functions where I can define using the HTML witch tag that will be wrapped by String ... (It should be smart in case there is overlap ...)

Answer 1

surroundContents()will have problems: if the selection includes several elements of the block, such as <div>or <p>s, the surrounded content will be placed in a new block, tearing it from its original position. To overcome this, you can easily adapt my answer here: apply style to a range of text with javascript in uiwebview

You will need to do the following:

• CSS "text-decoration: underline;"
• intersectsNode Range , , Firefox (. MDC : https://developer.mozilla.org/en/DOM/range.intersectsNode)
• IE, .

Answer 2

CSS text-decoration: underline.