Question

使用TinyMCE的setStyle（http://www.tinymce.com/wiki.php/API3:method.tinymce.dom.DOMUtils.setStyle），我可以设置元素的样式，例如：

<img style="border-width: 3px; border-style: solid;" id="avatar" width="40" height="40" alt="avatar.png" src="avatar.png" >

tinyMCE.DOM.setStyle('avatar', 'border-width', '2px');

如何删除样式？例如，我希望删除border-width和border-style？我知道我可以将border-width设置为零，但是，不希望因为它会产生其他问题。

Answer 1

浏览文档时，没有＆＃34; removeStyle＆＃34; -like选项。

也许您可以将值设置为继承？

Answer 2

TinyMCE似乎没有任何方法可以这样做。相反，请使用style。见http://jsfiddle.net/vcvj22rj/2/

<input type="button" value="Add" id="add" />
<input type="button" value="Remove" id="remove" />
<form method="post" action="somepage">
    <textarea name="content" style="width:100%">
        <div id="myDiv" style="background-color: blue; height: 50px; width: 50px"></div>
    </textarea>
</form>

tinymce.init({
    selector: "textarea"
});


$('#add').click(function () {
    //Question?  Is it "better" to use the ID or select the actual element?
    //var div=tinyMCE.activeEditor.dom.select('div');
    //tinyMCE.activeEditor.dom.setStyle(div, 'border-width', '5px');
    //tinyMCE.activeEditor.dom.setStyle(div, 'border-style', 'solid');
    tinyMCE.activeEditor.dom.setStyle("myDiv", 'border-width', '5px');
    tinyMCE.activeEditor.dom.setStyle("myDiv", 'border-style', 'solid');
});

$('#remove').click(function () {
    var div=tinyMCE.activeEditor.dom.select('div')[0];
    console.log(div,div.style);
    //Where is "style" property documented?
    div.style.removeProperty("border-width");
    div.style.removeProperty("border-style");
});

删除TinyMCE风格

2 个答案: