TinyMCE链接插件添加自定义属性

TinyMCE link plugin add custom attribute

本文关键字：自定义属性 添加 接插件 链接 TinyMCE      更新时间：2023-09-26

我有TinyMCE v 3.5.11。在链接插件中我添加了自定义

<tr>
                        <td><label for="class_list">{#param}</label></td>
                        <td><input id="parameter" name="parameter" type="text" value="" style="width: 200px" /></td>
                    </tr>
在js 

if (e = ed.dom.getParent(ed.selection.getNode(), 'A')) {
            f.href.value = ed.dom.getAttrib(e, 'href');
            f.linktitle.value = ed.dom.getAttrib(e, 'title');
            f.parameter.value = ed.dom.getAttrib(e, 'parameter');
            f.insert.value = ed.getLang('update');
            selectByValue(f, 'link_list', f.href.value);
            selectByValue(f, 'target_list', ed.dom.getAttrib(e, 'target'));
            selectByValue(f, 'class_list', ed.dom.getAttrib(e, 'class'));
        }

tinymce.each(ed.dom.select("a"), function(n) {
                if (ed.dom.getAttrib(n, 'href') == '#mce_temp_url#') {
                    e = n;
                    alert(f.parameter.value);
                    ed.dom.setAttribs(e, {
                        href : href,
                        title : f.linktitle.value,
                        parameter: f.parameter.value,
                        target : f.target_list ? getSelectValue(f, "target_list") : null,
                        'class' : f.class_list ? getSelectValue(f, "class_list") : null
                    });
                }
            });
        } else {
            ed.dom.setAttribs(e, {
                href : href,
                title: f.linktitle.value,
                parameter: f.parameter.value
            });

当我查看源插件时，我没有看到这个参数。但是如果我用firebug查看html，我会看到这个参数

我已经提交了一个pull request: #4515到官方的repo。

使用

tinymce.init({
  selector: '.tinymce',
  plugins: 'link',
  toolbar: 'link',
  link_data_list: [
    { title: 'Custom 1', slug: 'custom_1' },
    { title: 'Custom 2', slug: 'custom_2' },
  ]
});

生成

<a ... data-custom_1="your data 1" data-custom_2="your data 2">Your favourite link</a>
相关文章：