Question

我在此结构是根据上一个问题构建的：

jQuery(document).ready(function($) {
  let entries = [jQuery("#row .entry")].map(data => ({
    issue: data.children[0].children[0].value,
    value: data.children[1].children[0].value
  }));
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="row">
  <div id="entry-wrapper">
    <div class="entry">
      <div class="text-wrapper">
        <input type="text" class="text" value="ABC">
      </div>
      <div class="value-wrapper">
        <input type="text" class="value" value="123">
      </div>
    </div>
    <div class="entry">
      <div class="text-wrapper">
        <input type="text" class="text" value="DEF">
      </div>
      <div class="value-wrapper">
        <input type="text" class="value" value="456">
      </div>
    </div>
  </div>
</div>

由于CSS，我需要将所有内容包装到一些div和包装器中，现在我无法获取对象数组中的所有文本和相关值。我做错了什么？

Answer 1

要将jQuery集合转换为标准Array，您不应这样做：

[jQuery("#row .entry")]

...因为这将创建一个只有一个值的数组，而该值就是jQuery集合。

请改为使用jQuery为此提供的方法，即get()：

没有参数，.get()返回所有元素的数组

所以：

jQuery("#row .entry").get()

Answer 2

您不应该将jQuery对象包装在数组中。就是将data设置为jQuery集合，而不是元素。

jQuery有自己的map()方法，您可以使用该方法遍历集合中的元素（请注意，它以与Array.prototype.map()相反的顺序接受参数）。它返回一个jQuery对象，但是您可以调用.get()将该对象转换为普通数组。

jQuery(document).ready(function($) {
  let entries = $("#row .entry").map((i, data) => ({
    issue: data.children[0].children[0].value,
    value: data.children[1].children[0].value
  })).get();
  console.log(entries);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="row">
  <div id="entry-wrapper">
    <div class="entry">
      <div class="text-wrapper">
        <input type="text" class="text" value="ABC">
      </div>
      <div class="value-wrapper">
        <input type="text" class="value" value="123">
      </div>
    </div>
    <div class="entry">
      <div class="text-wrapper">
        <input type="text" class="text" value="DEF">
      </div>
      <div class="value-wrapper">
        <input type="text" class="value" value="456">
      </div>
    </div>
  </div>
</div>

Answer 3

您可以使用Array.from方法将jQuery集合转换为JavaScript数组。

Pages

class PagesController < ApplicationController
    def index
    end
end

从HTML创建对象数组不起作用

3 个答案: