原文地址:http://ssh-2009-126-com.javaeye.com/blog/599501

Java代码
  1. <script type="text/javascript" src="<your installation path>/tiny_mce/tiny_mce.js"></script>   
  2. <script type="text/javascript">   
  3. // Creates a new plugin class and a custom listbox   
  4. tinymce.create('tinymce.plugins.ExamplePlugin', {   
  5.      createControl: function(n, cm) {   
  6.         switch (n) {   
  7.             case 'mylistbox':   
  8.                  var mlb = cm.createListBox('mylistbox', {   
  9.                       title : 'My list box',   
  10.                       onselect : function(v) {   
  11.                           tinyMCE.activeEditor.windowManager.alert('Value selected:' + v);   
  12.                       }   
  13.                  });   
  14.   
  15.                 // Add some values to the list box   
  16.                  mlb.add('Some item 1', 'val1');   
  17.                  mlb.add('some item 2', 'val2');   
  18.                  mlb.add('some item 3', 'val3');   
  19.   
  20.                 // Return the new listbox instance   
  21.                 return mlb;   
  22.   
  23.             case 'mysplitbutton':   
  24.                  var c = cm.createSplitButton('mysplitbutton', {   
  25.                      title : 'My split button',   
  26.                      image : 'img/example.gif',   
  27.                      onclick : function() {   
  28.                          tinyMCE.activeEditor.windowManager.alert('Button was clicked.');   
  29.                      }   
  30.                  });   
  31.   
  32.                  c.onRenderMenu.add(function(c, m) {   
  33.                      m.add({title : 'Some title', 'class' : 'mceMenuItemTitle'}).setDisabled(1);   
  34.   
  35.                      m.add({title : 'Some item 1', onclick : function() {   
  36.                          tinyMCE.activeEditor.windowManager.alert('Some   item 1 was clicked.');   
  37.                      }});   
  38.   
  39.                      m.add({title : 'Some item 2', onclick : function() {   
  40.                          tinyMCE.activeEditor.windowManager.alert('Some   item 2 was clicked.');   
  41.                      }});   
  42.                  });   
  43.   
  44.                 // Return the new splitbutton instance   
  45.                 return c;   
  46.          }   
  47.   
  48.         return null;   
  49.      }   
  50. });   
  51.   
  52. // Register plugin with a short name   
  53. tinymce.PluginManager.add('example', tinymce.plugins.ExamplePlugin);   
  54.   
  55. // Initialize TinyMCE with the new plugin and listbox   
  56. tinyMCE.init({   
  57.      plugins : '-example', // - tells TinyMCE to skip the loading of the plugin   
  58.      mode : "textareas",   
  59.      theme : "advanced",   
  60.        
  61. });   
  62. </script>   
  63.   
  64. <form method="post" action="somepage">   
  65.      <textarea name="content" style="width:100%">   
  66.      </textarea>   
  67. </form>  

Menu button example

JavaScipt代码

  1. <script type="text/javascript" src="<your installation path>/tiny_mce/tiny_mce.js"></script>   
  2. <script type="text/javascript">   
  3. // Creates a new plugin class and a custom listbox   
  4. tinymce.create('tinymce.plugins.ExamplePlugin', {   
  5.      createControl: function(n, cm) {   
  6.         switch (n) {   
  7.             case 'mymenubutton':   
  8.                  var c = cm.createMenuButton('mymenubutton', {   
  9.                      title : 'My menu button',   
  10.                      image : 'img/example.gif',   
  11.                      icons : false  
  12.                  });   
  13.   
  14.                  c.onRenderMenu.add(function(c, m) {   
  15.                      var sub;   
  16.   
  17.                      m.add({title : 'Some item 1', onclick : function() {   
  18.                          tinyMCE.activeEditor.execCommand('mceInsertContent', false, 'Some item 1');   
  19.                      }});   
  20.   
  21.                      m.add({title : 'Some item 2', onclick : function() {   
  22.                          tinyMCE.activeEditor.execCommand('mceInsertContent', false, 'Some item 2');   
  23.                      }});   
  24.   
  25.                      sub = m.addMenu({title : 'Some item 3'});   
  26.   
  27.                      sub.add({title : 'Some item 3.1', onclick : function() {   
  28.                          tinyMCE.activeEditor.execCommand('mceInsertContent', false, 'Some item 3.1');   
  29.                      }});   
  30.   
  31.                      sub.add({title : 'Some item 3.2', onclick : function() {   
  32.                          tinyMCE.activeEditor.execCommand('mceInsertContent', false, 'Some item 3.2');   
  33.                      }});   
  34.                  });   
  35.   
  36.                 // Return the new menu button instance   
  37.                 return c;   
  38.          }   
  39.   
  40.         return null;   
  41.      }   
  42. });   
  43.   
  44. // Register plugin with a short name   
  45. tinymce.PluginManager.add('example', tinymce.plugins.ExamplePlugin);   
  46.   
  47. // Initialize TinyMCE with the new plugin and menu button   
  48. tinyMCE.init({   
  49.      plugins : '-example', // - tells TinyMCE to skip the loading of the plugin   
  50.      mode : "textareas",   
  51.      theme : "advanced",   
  52.      theme_advanced_buttons1 : "mymenubutton,bold,italic,underline,separator,strikethrough,justifyleft,justifycenter,justifyright,justifyfull,bullist,numlist,undo,redo,link,unlink",   
  53.      theme_advanced_buttons2 : "",   
  54.      theme_advanced_buttons3 : "",   
  55.      theme_advanced_toolbar_location : "top",   
  56.      theme_advanced_toolbar_align : "left",   
  57.      theme_advanced_statusbar_location : "bottom"  
  58. });   
  59. </script>   
  60.   
  61. <form method="post" action="somepage">   
  62.      <textarea name="content" style="width:100%">   
  63.      </textarea>   
  64. </form>