HTML编辑器嵌入在管理页面中

时间:2013-07-31 15:22:31

标签: php jquery html wysiwyg jqte

我正在为公司制作一个简单的网页,公司希望能够不时自己编辑内容。但是他们没有编程知识,因此我想使用嵌入式HTML编辑器,我选择了jQuery TE

问题在于我只知道如何将其用作表格,例如:

<form id = "wyForm" method="post" action="test.php">
    <textarea class="editor"name = "testText">Hi</textarea>
    <input type="submit" class="wymupdate" />
</form>

然后我会使用jQuery将textarea转换为编辑器:

<script> $('.editor').jqte() </script>

这使得可以将结果发送到更新数据库的.php页面。但是很多次我不想使用文本字段或表单,而只是一个简单的对象,我以同样的方式转换为编辑器。但是如何在这种情况下保存更改呢?

1 个答案:

答案 0 :(得分:0)

抓住表单提交事件并将内容复制到隐藏字段。

<form id = "wyForm" method="post" action="test.php">
    <div class="editor" name="testText">Hi</div>
    <input type="submit" class="wymupdate" />
    <input type="hidden" id="editorHiddenField" />
</form>

...

$('#wyForm').submit(function() {
   $('#editorHiddenField').val($('.editor').html());
});

您可能需要使用API​​来获取内容(我不熟悉插件),但概念很合理。

修改 - 如果您不想使用表单

<div class="editor></div>
<button id="SaveButton">Save</button>

...

$(document).ready(function() {
    $('#SaveButton').click(function(e) {
        e.preventDefault();
        $.post('savepage.php', { data: $('.editor').html() }).done(function() { alert('saved!'); });
    });
});