添加自定義下拉/按鈕主編所見即所得

Question

我有兩個問題：

1. 我想有這樣一個按鈕：

   buttons: buttons, 
   buttonsCustom: { 
       sh: { 
       title: 'Syntax Highlighter', 
       callback: function(){ 
        var html = "<pre class='brush:'></pre>"; 
        this.execCommand('inserthtml', html); 
       } 
       } 
   } 
   

   出現在我的按鈕，但是當我點擊它說，「這個」沒有「execCommand」函數。它是如何工作的 ？我怎麼能說「這個」是Redactor？ 你知道我的意思嗎？

2. 是否可以創建一個下拉列表？

Answer 1

我固定它通過自己：

callback: function(obj){ 
    var html = "<pre class='brush:'></pre>"; 
    obj.execCommand('inserthtml', html); 
} 

Answer 2

我想在編輯者添加自定義按鈕等。我把你的代碼和我的目的更改了代碼。它爲我，你可以去看看：

$(document).ready(
    function() 
    { 
     $('.redactor').redactor({ 
      focus: true, 
      buttonsAdd: ['|', 'token'], 
      buttonsCustom: { 
       token: { 
        title: 'Ajouter une variable', 
        dropdown: { 
         header: {title: 'Entête',callback: function(obj){obj.insertHtml('%header%');}}, 
         footer: {title: 'Signature',callback: function(obj){obj.insertHtml('%footer%');}}, 
         last_name: {title: 'Nom',callback: function(obj){obj.insertHtml('%last_name%');}}, 
         first_name: {title: 'Prénom',callback: function(obj){obj.insertHtml('%first_name%');}}, 
         date: {title: 'Date',callback: function(obj){obj.insertHtml('%date%');}}, 
         contract: {title: 'Contrat',callback: function(obj){obj.insertHtml('%contract%');}} 
        } 
       } 
      } 
     }); 
    } 
); 

乾杯

Answer 3

望着主編源（最新版本8.2.6），我注意到，你可以傳遞一個第四個參數插件API的addBtn功能描述一個下拉菜單。因此，假設您想從插件中添加字體大小下拉菜單：

RedactorPlugins.fontSize = { 

    init: function(obj) { 

     btnCallback = function(obj,event,key) { 
      // button actions, if any 
     } 

     dropdown = { 
      small: { 
       title: 'Small' 
       callback: function(obj,event,key) { //set the font size to small } 
      } 
      medium: { 
       title: 'Medium' 
       callback: function(obj,event,key) { //set the font size to medium } 
      } 
     } 

     this.addBtn('fontSize','Change font size', btnCallback, dropdown); 
    } 

}