选择html到json转换答案

【问题标题】：select html to json conversion选择html到json转换
【发布时间】：2016-06-17 09:26:10
【问题描述】：

我有一个带有 select ui 元素的 alpaca 表单，我可以在其中选择多个值并保存表单。当我使用 JSON.stringify(val) 保存表单时，生成的表单有问题。 JSON 仅具有选定元素的 id。我希望 JSON 包含 id 和值

<select id="alpaca4" multiple="multiple" size="5" name="roles" class="alpaca-control form-control">
<option value="1">one</option>
<option value="2">two</option> 
</select>

生成的json格式为：

{"roles":["1","2"]}

我期望的格式是：

{"roles":["1":"One","2":"Two"]}

【问题讨论】：

["1":"One","2":"Two"] 不是有效的Array-of-Objects
["1":"One","2":"Two"] 不是任何类型的有效 JSON。
“当我使用 JSON.stringify(val) 保存 json 表单时” — 你是如何定义 val 的？
val = this.getValue() 给出表单的对象符号
请找到正确的json格式{"roles":[{"1":"One"},{"2":"Two"}]}

标签： javascript jquery json alpacajs

【解决方案1】：

使用jQuery#map

var mapped = $('#alpaca4 option').map(function() {
  var obj = {};
  obj[this.value] = this.textContent;
  return obj;
});
console.log(mapped.get());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<select id="alpaca4" multiple="multiple" size="5" name="roles" class="alpaca-control form-control">
  <option value="1">one</option>
  <option value="2">two</option>
</select>

【讨论】：

感谢您的解决方案。我的表单还有许多其他的ui元素以及select ui元素。我需要生成整个表单的json，这可以通过JSON.stringify(val)和json来实现单独的选择元素应该按照您的建议。如何做到这一点
@ramnar，你在使用serialize 吗？
im 使用 var val = this.getValue(); var json = JSON.stringify(val)
@ramnar，从未听说过getValue 方法；(

【解决方案2】：

您应该只保留值，而不是标签。根据 html 表单的工作方式，Alpaca 在这里做的是正确的事情。

【讨论】：