TinyMCE удаляет атрибут из пользовательского тега - PullRequest
2 голосов
/ 03 января 2012

Я пытаюсь вставить заполнитель в HTML-код, который будет динамически заменен позже.Пока мне удалось вставить код, и TinyMCE распознает тег, но когда я пытаюсь добавить к нему атрибут id, атрибут удаляется по неизвестной причине.Я перепробовал большинство дополнительных опций, но ни одна из них не работает.

Текущая конфигурация:

extended_valid_elements : "module[id]",
valid_children : "module[img]",
custom_elements : "module",

Код для создания кнопки (и последующего вставки кода):

setup : function(ed) {
    // Add a custom button
    ed.addButton("module", {
        title : "Module",
        image : "images/app-x-php-icon.png",
        onclick : function() {
            ed.focus();
            var options = document.getElementById('rendermcemods').innerHTML+"";
            var optionList = options.split('|');
            var name=prompt("Please enter module name out of: "+options,optionList[0]);
            for(var i=0;i<optionList.length;i++){
                if(optionList[i] == name){ 
                    var patt=new RegExp('<module id="'+name+'">.*</module>','ig');
                    var content = '<module id="'+name+'"><img src="images/app-x-php-icon.png" /></module>';
                    //alert(content);
                    if(! patt.test(ed.getContent())){ 
                        ed.execCommand('mceInsertContent', false,content);
                    }                            
                }
            }                                            
        }   
    });                
}

Как вы могли заметить, перед вставкой есть предупреждение, которое я использовал для проверки правильности содержимого ... Когда я использую кнопку, чтобы вставить код, а затем просмотреть HTML, вот что я получаю:

<module><img src=images/app-x-php-icon.png" alt="" /></module>

Кто-нибудь знает, как это исправить?

Обновление:

полные настройки конфигурации для tinyMCE:

// General options
        mode : "none",
        theme : "advanced",
        plugins : "autolink,lists,spellchecker,pagebreak,style,layer,table,\n\
                    save,advhr,advimage,advlink,emotions,iespell,inlinepopups,\n\
                    insertdatetime,media,searchreplace,print,contextmenu,paste,\n\
                    directionality,fullscreen,noneditable,visualchars,\n\
                    nonbreaking,xhtmlxtras",

        // Theme options
        theme_advanced_buttons1 : "fullscreen,help,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,styleselect,formatselect,fontselect,fontsizeselect,|,module",
        theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,code,|,insertdate,inserttime,|,forecolor,backcolor",
        theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,ltr,rtl,|,spellchecker,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,blockquote,|,insertfile,insertimage",
        theme_advanced_toolbar_location : "top",
        theme_advanced_toolbar_align : "left",
        theme_advanced_statusbar_location : "bottom",
        theme_advanced_resizing : true,

        // Skin options
        skin : "o2k7",
        skin_variant : "silver",

        document_base_url : "http://www.example.com",
        content_css : "content.css", 
        extended_valid_elements : "module[id]",
        valid_children : "module[img]",
        /*custom_elements : "module", */           

        // Drop lists for link/image/media/template dialogs            
        external_link_list_url : "js/generateList.php?A=link",
        external_image_list_url : "js/generateList.php?A=image",
        media_external_list_url : "js/generateList.php?A=media",

        setup : function(ed) {
            // Add a custom button
            ed.addButton("module", {
                title : "Module",
                image : "images/app-x-php-icon.png",
                onclick : function() {
                    ed.focus();
                    var options = document.getElementById('rendermcemods').innerHTML+"";
                    var optionList = options.split('|');
                    var name=prompt("Please enter module name out of: "+options,optionList[0]);
                    for(var i=0;i<optionList.length;i++){
                        if(optionList[i] == name){ 
                            var patt=new RegExp('<module id="'+name+'">.*</module>','ig');
                            var content = '<module id="'+name+'"><img src="images/app-x-php-icon.png" /></module>';
                            //alert(content);
                            if(! patt.test(ed.getContent())){ 
                                ed.execCommand('mceInsertContent', false,content);
                            }                            
                        }
                    }                                            
                }   
            });                
        }

Другое обновление: Этоможет быть интересно (и, надеюсь, поможет решить) знать, что атрибут id не удаляется, когда tinyMCE загружен, и он уже там, и очистка существующего кода с атрибутом тоже не удаляет его.

Ответы [ 2 ]

1 голос
/ 04 января 2012

Я бы поставил module в valid_elements вместо extended_valid_elements/custom_elements. extended_valid_elements иногда ведут себя странно.

Моя собственная конфигурация выглядит следующим образом (вам нужно увеличить свои собственные настройки valid_elements и valid_children (если они не используются в вашей пользовательской конфигурации tinymce, вам придется использовать значения по умолчанию) ))):

// The valid_elements option defines which elements will remain in the edited text when the editor saves.
valid_elements: "@[id|class|title|style|onmouseover]," +
"module," +
"a[name|href|target|title|alt]," +
"#p,blockquote,-ol,-ul,-li,br,img[src|height|width],-sub,-sup,-b,-i,-u," +
"-span[data-mce-type],hr",

valid_children: "body[p|ol|ul|hr]" +
"module[img]" +
",p[a|span|b|i|u|sup|sub|img|hr|#text|blockquote]" +
",span[a|b|i|u|sup|sub|img|#text|blockquote]" +
",a[span|b|i|u|sup|sub|img|#text|blockquote]" +
",b[span|a|i|u|sup|sub|img|#text|blockquote]" +
",i[span|a|b|u|sup|sub|img|#text|blockquote]" +
",sup[span|a|i|b|u|sub|img|#text]" +
",sub[span|a|i|b|u|sup|img|#text]" +
",li[span|a|b|i|u|sup|sub|img|ol|ul|#text]" +
",ol[li]" +
",ul[li]",
0 голосов
/ 06 января 2012

Решением, которое я использовал в итоге, было изменение blockElementsMap и переходной карты, которые находятся в исходном коде.Казалось, что это единственный способ получить пользовательский тег, распознаваемый как элемент 'blocklevel', а также добавить его в точности так, как я хочу в коде для последующей обработки.

...