Javascript 序列化Ajax POST的多个选择框

我将使用一个玩具示例来说明我的问题：

我有一个表单，可以获取用户的一些详细信息：

<form action="#" method="post" id="myform">
    <input type="text" name="fname" />
    <input type="text" name="sname" />
    <input type="text" name="birthdate" />
    <select name="hobbies">
        <option>Programming</option>
        <option>Eating cats</option>
        <option>Explaining string theory to my grandmother</option>
    </select>
</form>

这个很好用

现在，我需要在同一页面上获取关于多个用户的相同信息。没问题，我只是在输入名称中添加了

[]

：

<form action="#" method="post" id="myform">
    <input type="text" name="fname[]" />
    <input type="text" name="sname[]" />
    <input type="text" name="birthdate[]" />
    <select name="hobbies[]">
        <option>Programming</option>
        <option>Eating cats</option>
        <option>Explaining string theory to my grandmother</option>
    </select>
</form>

程序设计
吃猫
向我祖母解释弦论

再说一次，世界上一切都很好

现在，我想允许用户选择多个爱好：

<form action="#" method="post" id="myform">
    <input type="text" name="fname[]" />
    <input type="text" name="sname[]" />
    <input type="text" name="birthdate[]" />
    <select name="hobbies[]" multiple>
        <option>Programming</option>
        <option>Eating cats</option>
        <option>Explaining string theory to my grandmother</option>
    </select>
</form>

程序设计
吃猫
向我祖母解释弦论

这就是事情开始有点梨形的地方。当我现在调用

serialize（）

时，所有爱好都放在一个数组中，所以我无法说出哪个用户有哪些爱好

我曾尝试使用

[]]

而不是

[]

，但这只是将每个项目放入嗜好数组中它自己的数组中，因此我仍然丢失了用户->嗜好链接

我能看到的唯一方法就是编写自己的

serialize（）

，根据需要对内容进行分组

---

有更好、更简单或更优雅的方法吗？

我的标准方法是将

用户ID

附加到输入名称，并在它们之间加下划线

因此，与此相反：

<input type="text" name="fname[]" />

它将是：

<input type="text" name="fname_23423" />

---

然后，在服务器端，您在

\uu

上拆分输入名称。第一个元素是输入名称，第二个元素是

用户ID

，您都已设置好。

我也遇到过类似的问题，但我的方法是为每个用户分配一个特定的数组

比如说

程序设计
吃猫
向我祖母解释弦论

谢谢您的回答。我曾考虑过类似的方法。问题是我正在修改一个已经在使用的表单，它现在有时会有多个选择。所以，我希望有一些HTML或javascript技巧是我遗漏的，不需要对现有结构做太多更改。是的，这是我一直在考虑的另一个答案的变体。与另一个答案一样，问题在于它将把把所有内容都转换回数组的问题转移到了服务器上。这解决了所有爱好都在一个数组中的问题。每个用户都有自己的数据数组。如果您不能在前端和后端进行太多的更改，那么您可能必须创建自己的序列化函数，以生成服务器可以理解的“包”。我想你仍然可以使用这种方法，通过每个不同的“名称”组收集你需要的信息。这肯定是解决问题的一种可能的方法，这就是为什么我投了赞成票。我目前正在考虑创建一个函数，以按照我需要的方式进行序列化。

<input type="text" name="fname_23423" />

<form action="#" method="post" id="myform">
    <input type="text" name="user1[fname]" />
    <input type="text" name="user1[sname]" />
    <input type="text" name="user1[birthdate]" />
    <select name="user1[hobbies]" multiple>
        <option>Programming</option>
        <option>Eating cats</option>
        <option>Explaining string theory to my grandmother</option>
    </select>
    <a href="#" id="submit">Submit</a>
</form>