javascript - contenteditable="true"无法提交到php，该怎么办？

Question

最近在开发一个富文本编辑器，考虑到textarea只能输入文本，所以我用p的contenteditable="true"属性实现了富文本，可以插入图片，视频等。

但是问题来了，在表单页面:

<form action="test.php" method="post">
<p contenteditable="true" name="zhengwen"></p>
<input type="submit">
</form>

这样做，p里面的内容，根本就无法提交到test.php页面的，echo $_POST[zhengwen];是没输出的。

我怀疑根本就没有提交过来。

大家知道怎么解决吗？求表单提交页面和接收页面的简单代码！！！

Answer 1

确实是没提交过去，因为，表单里的提交按钮，只提交表单元素。而<p contenteditable="true">并非表单元素。

如果要将<p contenteditable="true">的信息提交过去，需要自己构造POST的信息提交过去，需要自己构造POST请求，我就以jQuery为例：

$('form').submit(function(e) {
    e.preventDefault(); // 拦截HTML的默认表单提交

    var content = $('p[name=zhengwen]').html();
    $.post('....', {zhengwen: content}, functino(data) {
        // 成功回调
    });
});

当然了，jQuery的POST提交还有好多种写法，比如$.ajax()等。

PHP端接收时，和平常一样读取$_POST就可以了。

Answer 2

雷雷