有什么方法可以获取表单元素及其相关值答案

【问题标题】：is there any way to get form elements and its related values有什么方法可以获取表单元素及其相关值
【发布时间】：2016-12-16 05:17:26
【问题描述】：

我有一个div

<div id="ip"> 
   <input type="text" name="first" value="cobra" class="mark1"/>
   <input type="text" name="second" value="python" class="mark2"/>
</div>

我是这样连载的，

$('div#ip:input').serialize();

如果我执行上述div 中的serialization，我将只获得价值，但我也想要element，有什么好的方法可以做到这一点，或者我必须将整个html element 存储到我的 database 就像上面的 div 一样，实际上它会很大。

我的问题：将html element 存储到database 中的最佳方式是什么，就像上面的div 一样，它的所有values,names,classes fields 必须完好无损。

我在服务器端使用php。

最后一个问题：存储html element是唯一的方法吗？

【问题讨论】：

你需要添加form 而不仅仅是div 然后你可以像$('#FormId).serialize();一样使用
首先为什么你的数据库中需要 html 输入字段？
为什么要这个元素？按元素，您是指<input> 吗？（只是为了让我们清楚我们在谈论同一件事）
如果您心胸宽广，可以为html elements 创建一个表，为他们的properties and values 创建一个表。
我指的是这个帖子stackoverflow.com/questions/1829519/…

标签： javascript php jquery

【解决方案1】：

您可以使用outerHTML 来获取序列化的 HTML 片段。

然后使用toString() 将其转换为字符串。稍后您可以将此字符串保存在数据库中。它会将值与标签一起保存。

 var a = (document.getElementById("ip").outerHTML);
 a.toString();// convert to string. Save this string in database

以后用jqueryparseHTML把这个字符串转成html，重绘dom

// demodiv is a placeholder to convert string to html and repaint the dom
$("#demoDiv").append($.parseHTML(a)) // a is the value retrieved from db

DEMO

【讨论】：

我知道这是一个解决方案，这是将非常大的string 存储到database 的最佳方式吗？？？
@DilipG 似乎这是一个与数据库相关的问题

【解决方案2】：

您可以循环获取每个输入类的值和名称，然后对服务器进行 ajax 调用并将数据保存到数据库：

var data =[];
$('input,textarea,select').each(function(){
     data.push({
       class:$(this).attr('class'),
       name:$(this).attr('name'),
       value:$(this).val();
     });
});
console.log(data);

【讨论】：

我使用formbuilder.js 这是drag 和drop 对于elements 所以我在问这个问题

【解决方案3】：

您可以使用以下代码：

$("#ip").clone().html()

【讨论】：