YUI丰富的编辑器+无效的HTML +样式

Question

I am trying to insert an inline style tag into the editor content. When I call saveHTML it strips out the style block when I'm in rich editor view. I have tried changing the style property of invalidHTML to false, but it still seems to strip the style block out.

Any pointers to the API or suggestions would be helpful at this stage!

Thanks, Col.

Answer 1

I hope I understand your question properly. You just want to be able to insert something like this in your textarea?

<style>
    .className { font-weight: bold;}
</style>

If so this is how I have it working using what is specified in the YUI API documentation. In particular this part on invalidHTML

Before I initialize the editor I specify all the invalid tags I want stripped out:

var invalidTags = {"abbr":{ "keepContents":true }, 
    "acronym":{ "keepContents":true }, "address":{ "keepContents":true }, 
    "applet":"", "area":"", "base":"", "basefont":"", "bdo":"", "big":"", 
    "blockquote":{ "keepContents":true }, "body":{ "keepContents":true }}

Mine's a rather long list (basically all html tags) as I exclude everything except p, style, br, ul, ol, li. So in your case you'd leave out the style tag.

Then I set up the editor and then pass in the invalidTags as the invalidHTML for the editor before rendering.

So this is what everything looks like after all is said and done.

var invalidTags = {"abbr":{ "keepContents":true }, 
    "acronym":{ "keepContents":true }, "address":{ "keepContents":true }, 
    "applet":"", "area":"", "base":"", "basefont":"", "bdo":"", "big":"", 
    "blockquote":{ "keepContents":true }, "body":{ "keepContents":true }}

var editor = new YAHOO.widget.Editor('myeditor', {
    height: '300px',
    width: '500px',
    dompath: true,
    filterWord: true
}

editor.invalidHTML = invalidTags;
editor.render();

YAHOO.util.Event.on('Update', 'click', function() {
    editor.saveHTML();
}

So that's that for how I get it to preserve the tags I want. eg. style.

Hope that helps you out.