插入自定义元素，属性被剥离答案

【问题标题】：Inserting custom element, attribute gets stripped插入自定义元素，属性被剥离
【发布时间】：2018-09-23 18:37:38
【问题描述】：

我对这个问题做了一个tinymce fiddle：http://fiddle.tinymce.com/O0gaab

我添加了一个自定义元素“custom-block”和一个自定义插件来插入该元素。

tinymce.PluginManager.add('custom', function(editor, url) {
    editor.addButton('custom', {
      text: 'CUSTOM',
      onclick: function() {
        // Open window
        editor.windowManager.open({
          title: 'Custom plugin',
          body: [
            {type: 'textbox', name: 'src', label: 'SRC'},
            {type: 'label', name: 'title', text: 'Insert content bellow:'},
            {type: 'textbox', name: 'content', multiline: true, style: 'width:500px;height:100px;'}
          ],
          onsubmit: function(e) {
            console.log(e.data);
            editor.insertContent('<custom-block src="' + e.data.src + '">' + e.data.content + '</custom-block>');
          }
        });
      }
    });
});
tinymce.init({
    selector: "textarea",
    plugins: [
        "advlist autolink lists link image charmap print preview anchor",
        "searchreplace visualblocks code fullscreen",
        "insertdatetime media table contextmenu paste custom"
    ],
    toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image | custom",
    //valid_elements: "+*[*]", //when using this option trying to allow everything get an error "Cannot read property 'src' of undefined"
    extend_valid_elements: "custom-block[src]",
    custom_elements: "custom-block"
});

元素，正确插入但没有src 属性。

从文档中我认为extend_valid_elements: "custom-block[src]" 将允许src 属性在custom-block 上，但它每次都会被剥离。

我还尝试将 valid_elements 设置为所有内容（+*[*]）以防万一，但后来变得更糟，因为在插入时出现错误：“无法读取未定义的属性 'src'” em>。

我犯了什么错误或有什么问题？

【问题讨论】：

标签： tinymce tinymce-4

【解决方案1】：

配置选项的名称是extended_valid_elements，因此您只是在配置中将其命名错误。应该是：

extended_valid_elements: "custom-block[src]"

我已经更新了你的小提琴 (http://fiddle.tinymce.com/O0gaab/1)，一切似乎都正常了。

【讨论】：