Question

我希望访问HTML元素的数据（JSON记录）并将其推送到JavaScript中的数组中。

HTML是：

<td class="card-holder" data-card="{"id":0,"type":"Wildcard","image":"wildcard.png","strength":0,"type_image":"wildcard.png","region_owned_adder":0}">
      <img id="card-image-0" src="/img/wildcard.png" class="card-exchange">
      <input class="cards-checkbox" type="checkbox" id="card-0" name="cards_to_exchange[]" value="id=" 0""="">
      <label for="cards_to_exchange"></label>
</td>

我的页面上有很多这些。我在一个循环中读取每个并选择一些进入这样的数组：

var cards = [];
$('.card-exchange').each(function() {
    if ($(this).find('input[name="cards_to_exchange[]"]').is(':checked')) {
        var parseCard = JSON.parse(thisElement.data('card'));
        cards.push(parseCard);
    }
});

但这在循环后显示[]：

console.log(cards);

这显示数据OK：

console.log(thisElement.data('card'));

如何读取字符串并将其作为对象推入数组？感谢。

Answer 1

您在没有后代的.find()上使用<img>。

使用.next()来获取其<input>兄弟。

此外，您可以使用.filter()然后使用.map()进行清理。

var cards = $('.card-exchange').filter(function() {
    return $(this).next().is(':checked');
}).map(function() {
    return JSON.parse(thisElement.data('card'));
}).toArray();

虽然我不确定thisElement指的是什么。

你甚至可以将它缩短一点。

var cards = $('.card-exchange + input:checked')
  .prev()
  .map(function() {
     return JSON.parse(thisElement.data('card'));
  });

JSON元素在Javascript中推入数组

1 个答案: