Question

我正在使用jQuery和$.ajax()调用通过POST将一些复杂的HTML发布到我的数据库。我可以通过.html()获取表单的结构，但是用户的选择在此过程中丢失了。我以为我可以使用.clone()，但我收到了这个错误：

未捕获的InvalidStateError：无法读取'selectionDirection' 'HTMLInputElement'中的属性：输入元素的类型（'hidden'）不支持选择。

// Cloning my form
var myFormHTML = $("#myForm").clone();

console.log(myFormHTML);

var inputData = {
  advancedSearchHTML: myFormHTML,
  otherParam: otherVar
};

console.log(inputData);

// JS ERROR is down here in the $.ajax() call:
$.ajax({
    type: "POST",
    url: 'serverSideScript.php',
    dataType: 'html',
    data: inputData,
    success: function (response) {
        console.log(response);
    }
});

这些表单非常复杂，包含超过100 <input type="hidden">个，根据用户的选择而变化。我不能改变它的工作方式。所以我的问题是我有复杂的表单与用户生成的HTML，我需要复制HTML及其所有值，以便它可以插入我的数据库，并最终重新加载回DOM，也许几个月后。有什么想法吗？

编辑：我已经尝试了我能想到的一切，但我似乎无法从HTML中获取用户输入值，这令人沮丧，因为我习惯于点击“复制” HTML“在Chrome的Inspector中，所以对我而言，似乎很容易从<form>中将相同的HTML作为字符串。我试过的一些事情：

$myFormHTML.html()
$myFormHTML.innerHTML
$myFormHTML.outerHTML
$myFormHTML.get(0).innerHTML
$myFormHTML.get(0).outerHTML
JSON.stringify($myFormHTML.html())

我已经知道我有一个完整的jQuery对象，当附加到DOM时，包含了所有用户的输入（：选择状态，：检查状态，输入值等）。我需要使用这个jQuery Object并将其所有HTML内容吐出成一个可以传输到服务器的字符串。有谁知道该怎么办？也许有一种方法可以在$.append()期间完成相同的循环，所以我可以从头开始构建一个字符串？还有其他想法吗？

Answer 1

http://api.jquery.com/serialize/

这完全符合您的要求，但由于您的表单是由用户输入构建的，因此您无法验证它是否为有效表单。如果表单标记不正确，则无法序列化数据。

以下是示例：

http://jsfiddle.net/jyc30nxz/1/

$('#myForm').serialize();

这方面的一个重要方面是，如果您的表单输入没有＆＃34; name＆＃34;属性，然后你不能在序列化期间返回它的值，这就是为什么你最终得到一个空字符串。

编辑：

这也有效：

console.log($(this).clone().html())

我的猜测是您的表单标记无效

Answer 2

您是否尝试过.serialize表单内容？

jQuery .clone（）整个HTML表单及其所有值

2 个答案: