Question

嗨，大家好我需要简单的javascript for wysiwyg for my cms to bold text，underline text，line-trought，put text to left，to right，to center and quot quot to selected text。我不知道该怎么做因为我不懂javascript。有人可以帮我吗？我的代码是：

<form action="create_post.php">
        <input type="text" id="title_post" placeholder="Enter your post name" name="title_post">
        <div id="toolbox">
        <a href="#" id="bold">icon</a>
        <a href="#" id="italic">icon</a>
        <a href="#" id="underline">icon</a>
        <a href="#" id="line-through">icon</a>
        <a href="#" id="left_text">icon</a>
        <a href="#" id="center_text">icon</a>
        <a href="#" id="right_text">icon</a>
        <a href="#" id="quotes">icon</a>
        </div>
        <textarea id="content_post" name="content_post"></textarea>
        <input type="submit" id="button" value="Create post"> 
        </form>

Answer 1

我正在使用 Bootstrap-Wysiwyg 插件。

这个微小的（5KB，＆lt; 200行）jQuery Bootstrap插件将任何DIV转换为WYSIWYG内容丰富的编辑器，受到CLEditor和bootstrap-wysihtml5的启发。

Answer 2

如果您要求使用文本编辑器，我可以使用此工具TinyMCE

Answer 3

我建议使用现有的编辑器，如CKEditor，TinyMCE或Bootstrap WYSIWYG（如vdenotaris指出）。这些编辑器可以根据您的需要进行定制，并且还包括许多您可能需要的额外功能。

如果您仍想构建自己的属性，请尝试调查contenteditable属性。

它像这样工作

<div contenteditable="true">Editable content<div>

有关详细信息，请参阅http://html5doctor.com/the-contenteditable-attribute/。

现在您的内容是可编辑的，然后您需要使用一些JavaScript使您的按钮更改文本。在尝试更高级的系统之前，我建议你学习基础知识（查找元素，设置样式，事件处理程序等）。

希望这有帮助！

编辑：

我找到了一个教程，准确描述了您要做的事情：

https://thenewcircle.com/s/post/1096/using_the_html5_attribute_contenteditable_to_create_a_wysiwyg#part3

简单的javascript for cms wysiwyg

3 个答案: