1

I'm making my own WYSYWIG. I use execCommand and I have a problem with it.

There is a lot of tutorials on how to make a WYSIWYG.

When I change the font size or font type, my script generates code with tag. is outdated.

This is a very simple WYSIWYG like many you can find in tutorials. There is an iframe with onload function:

function loadIframe()
{
    document.getElementById('text-iframe').contentWindow.document.designMode = 'on';
}

And some buttons with onclick functions used to format the text.

This is the function I use for changing the font size:

function changeFontsize()
{
    var size = document.getElementById('fontsizeSelect').value;
    document.getElementById('text-iframe').contentWindow.document.execCommand('FontSize', false, size);
}

Other functions are pretty similar and use the same execCommand method, so I think I don't have to show them to you.

The code my WYSIWYG generates looks like this:

<font color="red" face="Verdana" size="5">test</font>

And my question is: How to make my WYSIWYG generate a modern code proper with HTML5? As it should be coded now, not with outdated tags.

Eerie
  • 15
  • 1
  • 7
  • you have to write your own javascript code to change them, http://stackoverflow.com/questions/5868295/document-execcommand-fontsize-in-pixels – MarkoCen May 11 '16 at 18:23
  • I will just leave it as it is and write a function that changes every into and it will be ok. Generating the html as it is and then editing the string looks most ok for me. – Eerie May 11 '16 at 23:37

1 Answers1

1

If you issue this statement once:

   document.execCommand( 'styleWithCSS', true )

then the code will generate something like:

<span style="font-family: Verdana; font-size: x-large;">test</span>
Tom Conlon
  • 21
  • 1