Hace unos días, le presenté un editor de XHTML nacional. Hoy quiero recomendarte TinyEditor. Es un editor HTML WYSIWYG simple y fácil de usar que recién lanzado por Leigeber.com, un conocido blog de diseño web extranjero.
TinyEditor tiene las siguientes características<TextArea id = Input Style = Width: 400px; Altura: 200px> </textarea>
Tenga en cuenta que la longitud y el ancho definidos en TextAREA son del tamaño del editor.
nuevo tiny.editor.edit ('editor', {id: 'input', // (debe) el IDWIDTH: 584 del textAREA definido en el segundo paso anterior, // (opcional) Ancho de ancho de editor: 175, // (opcional) Altura del editor CSSSClass: 'TE', // (Clase de opción) del editor, utilizado para controlar el estilo de estilo: 'Teconcontrol', // (opcional) (opcional) (opción) (opcional) (opcional) (opcional) classrowclass:'teheader', // (optional) Editor button line classdividerclass:'tedivider', // (optional) Editor button style controls:['bold', 'italic', 'underline', 'strikethrough', '|', 'subscript', 'superscript', '|', 'orderedlist', 'unorderedlist', '|', 'outdent', 'indent', '|', 'Leftalign', 'Centerign', 'RightAlign', 'BlockJustify', '|', 'Unformat', '|', 'Undo', 'redo', 'n', 'font', 'size', 'style', '|', 'Image', 'Hr', 'Link', 'Unlink', '|', 'Cut', 'Copy', 'Paste', ',', /, / Hr ',' Link ',' Unlink ',' '|', 'Cut', 'Copy', 'Paste', ',', ', / Hr', '. button controls to the editor as needed, where '|' represents the vertical split line between function buttons, and 'n' represents the split line between button lines footer:true, // (Optional) Whether to display the bottom fonts of the editor:['Verdana','Arial','Georgia','Trebuchet MS'], // (Optional) Selectable fonts in the editor xhtml:true, // (Optional) The editor generates xhtml or html tag cssfile:'style.css', // (Optional) External css file to be attached to the editor content:'starting content', // (Optional) Set the initial content in the editor editing area css:'body{background-color:#ccc}', // (Optional) Set the editor editing area background bodyid:'editor', // (optional) Set the Área de edición IDFooterClass: 'tefooter', // (opcional) Establezca el editor inferior classtoggle: {text: 'código de origen', activetext: 'visualization', cssclass: 'toggle'}, // (opcional) Estable clase});Se puede decir que es altamente configurable, y los elementos de configuración son relativamente claros.
En la aplicación real de TinyEditor, debe tenerse en cuenta que antes de enviar el contenido del editor, la función instancia.post () debe llamarse para garantizar que el último contenido visual en el área de edición se convierta en texto de etiqueta.
Ver ejemplo: http://sandbox.leigeber.com/tinyeeditor/
Descargar: código fuente de TinyEditor y archivos de muestra