2012-04-24 290 views
5

我一直在閱讀官方文檔和博客文章,所以幾個小時,某些地方的答案將張貼已經..但沒有運氣。如何防止tinymce從輸入元素中剝離'style'屬性?

似乎沒有任何配置擺弄的數量。停止tinymce從我的輸入/提交<p>元素中去除內聯「樣式」屬性。我需要所有輸入元素的'樣式'屬性..但我只是開始通過測試<p>甚至讓它工作。

  • TinyMCE的版本3.5b3

這裏是我的配置的最新迭代。 (超出許多變化/嘗試):

tinyMCE.init({ 
    mode : "textareas", 
    theme : "advanced", 

    plugins : "emotions,spellchecker,advhr,insertdatetime,preview,paste,table,media,directionality,style,xhtmlxtras,nonbreaking,pagebreak", 

    theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,formatselect,fontselect,fontsizeselect", 
    theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor", 
    theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,ltr,rtl", 
    theme_advanced_buttons4 : "styleprops,|,cite,abbr,acronym,del,ins,attribs,|,nonbreaking,pagebreak", 

    theme_advanced_toolbar_location : "top", 
    theme_advanced_toolbar_align : "left", 
    theme_advanced_statusbar_location : "bottom", 
    theme_advanced_resizing : true, 

    doctype : "<!DOCTYPE html>", 

    convert_urls : false, 

    //template_external_list_url : "gen4tinymce/lists/template_list.js", 
    external_link_list_url : "gen4tinymce/lists/link_list.js", 
    //media_external_list_url : "gen4tinymce/lists/media_list.js", 

    valid_elements : "@[id|class|style|title|dir<ltr?rtl|lang|xml::lang]," 
    + "a[rel|rev|charset|hreflang|tabindex|accesskey|type|" 
    + "name|href|target|title|class],strong/b,em/i,strike,u," 
    + "#p[style],-ol[type|compact],-ul[type|compact],-li,br,img[longdesc|usemap|" 
    + "src|border|alt=|title|hspace|vspace|width|height|align],-sub,-sup," 
    + "-blockquote,-table[border=0|cellspacing|cellpadding|width|frame|rules|" 
    + "height|align|summary|bgcolor|background|bordercolor],-tr[rowspan|width|" 
    + "height|align|valign|bgcolor|background|bordercolor],tbody,thead,tfoot," 
    + "#td[colspan|rowspan|width|height|align|valign|bgcolor|background|bordercolor" 
    + "|scope],#th[colspan|rowspan|width|height|align|valign|scope],caption,-div," 
    + "-span,-code,-pre,address,-h1,-h2,-h3,-h4,-h5,-h6,hr[size|noshade],-font[face" 
    + "|size|color],dd,dl,dt,cite,abbr,acronym,del[datetime|cite],ins[datetime|cite]," 
    + "object[classid|width|height|codebase|*],param[name|value|_value],embed[type|width" 
    + "|height|src|*],map[name],area[shape|coords|href|alt|target],bdo," 
    + "button,col[align|char|charoff|span|valign|width],colgroup[align|char|charoff|span|" 
    + "valign|width],dfn,fieldset,form[action|accept|accept-charset|enctype|method]," 
    + "input[accept|alt|checked|disabled|maxlength|name|readonly|size|src|type|value]," 
    + "kbd,label[for],legend,noscript,optgroup[label|disabled],option[disabled|label|selected|value]," 
    + "q[cite],samp,select[disabled|multiple|name|size],small," 
    + "textarea[cols|rows|disabled|name|readonly],tt,var,big", 

    extended_valid_elements : "p[style]", 
    inline_styles : true, 
    verify_html : false 
}); 

感謝您的任何建議!

回答

3

This fiddle顯示您的tinymce配置是絕對完美的:所有元素都可以使用樣式屬性,但它不會被剝離。

+1

是的,我剝了下來,整個事情作爲一個測試..隔離JUST TinyMCE的,它按預期工作,就像你說的,並顯示。所以我需要弄清楚什麼是剝離樣式屬性...我使用的PHP框架,CodeIgniter,或者什麼。我會回到這裏接受你的回答。我只是暫時將它開放,以防萬一任何人發佈一些東西,這可以讓我更多時間找出罪魁禍首。 ;-) – govinda 2012-04-24 15:35:18

12

正如Thariama指出的那樣,tinymce並沒有錯,但是我不知道CodeIgniter的所有功能都在做什麼。如果你發現你遇到同樣的問題,這是我如何解決它;請看這裏: Codeigniter - Disable XSS filtering on a post basis

+0

工作解決方案的+1和邪惡的源頭 – Thariama 2012-04-25 07:55:07

+0

不要使用CodeIgniter它是最糟糕的PHP框架之一;) – 2014-01-28 10:37:39

0

你可以用一個Ajax請求嘗試,這樣

$("#submit").click(function(e) { 
    ie8SafePreventEvent(e); 
    var form_data = $("#form").serialize(); 
    var content = $.base64.encode(tinyMCE.activeEditor.getContent()); 
    $.ajax({ 
     type: "POST", 
     url: "/your/post/processor", 
     data: form_data + "&coded_content=" + content, 
     success: function(return_msg){ 
      do_something 
      }, 
     error: function(){ 
      alert("Sorry, we got an error, try later"); 
      } 
     }); 
    }); 

顯然在你的控制器,你必須base64decode ...

0

我也是用笨,雖然我沒設置$config['global_xss_filtering'] = false;我仍然有樣式屬性的問題。因此,如果沒有一個解決方案,爲你工作,你可以嘗試提交,並使用其放置在一個隱藏字段的Javascript以base64 TinyMCE的數據進行編碼:

$('#hiddenField').val(window.btoa(tinyMCE.get('tinyMCEtextareaID').getContent())); 

這樣你保留原來的字符串,它可以很容易利用解碼PHP:

$htmlstring = base64_decode($_POST['hiddenField']);