Question

如何使用JQuery创建自定义按钮tinymce按钮？我需要n个“菜单项”按钮。在打开tinymce编辑器之前，将根据所选数据定义“ n”。

我的按钮：

editor.addButton('addButtons', {
        type: 'menubutton',
        text: 'My button',
        icon: false,
        menu: [
            {
                text: 'Menu item 1',
                onclick: function() {
                    editor.insertContent('&nbsp;<strong>item1</strong>&nbsp;');
                }
            }, {
                text: 'Menu item 2',
                onclick: function() {
                    editor.insertContent('&nbsp;<strong>item2</strong>&nbsp;');
                }
            }, {
                text: 'Menu item 3',
                onclick: function() {
                    editor.insertContent('&nbsp;<strong>item3</strong>&nbsp;');
                }
            }
        ] 
    });

我可以从使用JQuery $("#totalButtons").val()隐藏的输入类型中获取“ n”值。如果totalButtons为4，则需要4个项目按钮。是否有意义？有可能吗？

谢谢

更新代码：

var n = $('#total').val();
var menuItems = [];

  tinymce.init({
    selector: '#mytextareaTenant',
    content_css: 'https://fonts.googleapis.com/css?family=Aguafina+Script|Alex+Brush|Bilbo|Condiment|Great+Vibes|Herr+Von+Muellerhoff|Kristi|Meddon|Monsieur+La+Doulaise|Norican|Nothing+You+Could+Do|Parisienne|Permanent+Marker|Sacramento|Yellowtail',
    theme: 'modern',
    menubar: false,
    plugins: [
        "print"
    ],           

    setup: function (editor) { 
        editor.on('init', function (e) {
            renderEditorTenant();

            for (var i=1; i<=n; i++){
                var msg = '&nbsp;<strong>#item' + i + '#</strong>&nbsp;';
                var obj = {
                    text: 'Menu item ' + i,
                    onclick: function() {
                        editor.insertContent(msg);
                    }
                }
                menuItems.push(obj);
            }
        });

Answer 1

假设您有这样的隐藏输入：

<input type="hidden" id="foo" name="zyx" value="3" />

您可以获取输入的值并使用n个元素生成一个数组：

var n = $('#foo').val();
var menuItems = [];

for (var i=0; i<n; i++){
  var msg = '&nbsp;<strong>item' + i + '</strong>&nbsp;';
  var obj = {
    text: 'Menu item ' + i,
    onclick: function() {
        editor.insertContent(msg);
    }
}
  menuItems.push(obj);
}

现在，只需将此数组传递给用于生成编辑器的函数即可：

editor.addButton('addButtons', {
        type: 'menubutton',
        text: 'My button',
        icon: false,
        menu: menuItems
    });

自定义按钮数量tinymce

1 个答案: