使用HTML5，我如何在表单提交中使用contenteditable字段？ [英] Using HTML5, how do I use contenteditable fields in a form submission?

问题描述

所以我有一堆从db动态填充的段落元素。我让这些元素令人满意。我现在想通过标准表单提交将编辑提交回数据库。有没有办法将contenteditable元素发回？

解决方案

您必须使用javascript或其他方式， t作为一个标准形式的元素，就像它在textarea等那样工作。如果你喜欢，你可以在你的表单中创建一个隐藏的textarea，并在表单的onsubmit函数中将contenteditable的innerHTML复制到textarea的值。

 函数copyContent（）{
文档.getElementById（hiddenTextarea）。value = 
 document.getElementById（myContentEditable）。innerHTML; 
返回true; 
} 
 
 
< form action ='whatever'onsubmit ='return copyContent（）'> ... 
  

So I have a bunch of paragraph elements which are dynamically populated from a db. I have made the elements contenteditable. I now want to submit edits back the the db via a standard form submission. Is there a way to post the contenteditable elements back?

解决方案

You have to use javascript one way or the other, it won't work as a "standard" form element as it would with a textarea or the like. If you like, you could make a hidden textarea within your form, and in the form's onsubmit function copy the innerHTML of the contenteditable to the textarea's value. Alternatively you could use ajax/xmlHttpRqeuest to submit the stuff a bit more manually.

function copyContent () {
    document.getElementById("hiddenTextarea").value =  
        document.getElementById("myContentEditable").innerHTML;
    return true;
}


<form action='whatever' onsubmit='return copyContent()'>...

这篇关于使用HTML5，我如何在表单提交中使用contenteditable字段？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！