Question

当用户提交表单并将其值存储为数组时，我得到复选框的值，因此表单如下所示：

<!-- gym_create.html - I have removed the other inputs in the form for brevity -->

<form class="create-gym" role="form">
  <input type="checkbox" name="gymTags" value="Bodybuilding" id="tagBodybuilding" class="tag-checkbox"/>
  <input type="checkbox" name="gymTags" value="Powerlifting" id="tagPowerlifting" class="tag-checkbox"/>
  <button type="submit" class="btn create-form-submit">Save gym</button>
</form>

然后我在与表单相关联的JS文件中收集该信息：

// gym_create.js - I have removed the other values I collect apart from the gymName value for brevity

Template.gymCreate.events({
  "submit .create-gym": function (e) {

    e.preventDefault();

    var tagOutput = JSON.stringify({
    tagOutput: $(':checkbox[name=gymTags]:checked').map(function() {
        return $(this).val();
      }).get()
    });

    // Collect values from form when submitted
    var gymDetails = {
      gymName: $(e.target).find('[name=gymName]').val(),
      gymTags: tagOutput,
    }

    // Call method here
  }
});

然后我可以使用{{gymDetails.gymTags}}在我的模板中输出这些内容，但这会在浏览器中生成以下内容：

“{” TAGOUTPUT “：[” 锻炼原理 “ ”健“]}”

我想要的是一种将值存储为JSON的方法，因此它们就像这样：

{"gymTags": {
  "bodybuilding": "true",
  "powerlifting": "false"
}}

这样我就可以自己输出每个标签，并且只能访问之后为'true'（已经过检查过）的标签。

有谁知道我怎么回事？昨天我和所有人争吵，我能想到的最好的是=JSON.stringify

我不想将整个表单传递给JSON，只是复选框，是JSON.stringify我想要做的事情，还是我咆哮错误的树。

Answer 1

我认为应该这样做。你只是返回输入的值。您想要返回一个json对象，其中value是“索引”，checked属性是对象的“值”。

var tagOutput = JSON.stringify({
    tagOutput: $(':checkbox[name=gymTags]').map(function() {
        var op = {};
        op[this.value] = this.checked;
        return op;
    }).get()
});

编辑：如Da Rod所述，要使用选中和未选中的复选框，您必须删除“：checked”选择器。

Answer 2

由于您的选择器仅抓取已检查的项目，因此它们都是＆＃34; true＆＃34;。既然如此，你需要改变你的使用方式＆＃34; map＆＃34;向tagOutput添加属性。

var tagOutput = {}
$(':checkbox[name=gymTags]').map(function() {
        tagOutput[this.value] = this.checked;
    })
});

使用true或false存储JSON中的复选框值

2 个答案: