Javascript 在表单中使用contentEditable

我正在使用

contenteditable='true'

创建一个span或div格式的表单，我使用以下jQuery为所有

.formField

选择器创建隐藏表单字段，但我想知道这是最好的方法还是有更有效的方法。其思想是简单地通过标准方式提交页面，而不是使用ajax。谢谢

<script language="javascript">
$(document).ready(function(){
    $('form').submit(function(){
        $('.formField').each(function(){
            $('<input>').attr({
                type : 'hidden',
                id : $(this).attr('id'),
                name : $(this).attr('name'),
                value : $(this).html() 
            }).appendTo('form');
        })
    })
})
</script>
<form name = "contentEditableTest" id = "contentEditableTest" method = "post">
    <span id = "test" name = "test" contentEditable="true" class = "formField">This is editable</span>
    <span id = "test2" name = "test2" contentEditable="true" class = "formField">This is editable too</span>
    <input type = "submit" id ="submitIt" name="submitIt" value = "go"/>
</form>

$（文档）.ready（函数（）{
$（'form'）。提交（函数（）{
$（'.formField'）。每个（函数（）{
$（''）.attr({
键入：“隐藏”，
id:$（this.attr（'id'），
名称：$（this.attr（'name'），
值：$（this.html（））
}).附录（“形式”）；
})
})
})
这是可编辑的
这也是可编辑的

使用文本区域-将其样式设置为类似于para-code，以便：）在我看来，contentEditable用于需要高级内容格式的字段，如电子邮件、堆栈溢出问题等。@ClaudioSantos是的，在玩了一段时间后，我认为它可能不是解决此特定问题的最佳解决方案。。。