jQuery each - 将（this）与类规范结合起来

Posted 2023-03-16

【中文标题】jQuery each - 将（this）与类规范结合起来

【英文标题】：jQuery each - combining (this) with class specification

【发布时间】：2012-04-14 16:12:40

【问题描述】：

我正在尝试循环浏览一些表格行。简化的行如下：

<table>
  <tr id="ucf48">
    <td class="ucf_text">
      <input name="ucf_t48" value="Ann becomes very involved in the text she is reading." type="text">
    </td>
  </tr>
  <tr id="ucf351">
    <td class="ucf_text">
      <input name="ucf_t351" value="Ann is a fast and confident reader." type="text">
    </td>
  </tr>
</table>

我正在使用此代码循环：

$('#ucf tr').each(function(i,obj)
    var cn=$(this).attr('id').substr(3);
    var t=$(this +'.ucf_text input').val();

    console.log("Row "+i);
    console.log("Cnum: "+cn);
    console.log(t);
);

控制台输出为：

Row 0
Cnum: 48
Ann becomes very involved in the text she is reading.
Row 1
Cnum: 351
Ann becomes very involved in the text she is reading.

现在在有人激怒我之前，我知道我可以通过使用“名称”引用我想要的数据来以另一种方式做到这一点。但是，为什么我的 cnum 变量跟随 'this' 而 t 变量却没有？

谢谢。

【问题讨论】：

谢谢大家。我今天又学到了一些东西:)

【参考方案1】：

当你这样做时：

var t=$(this +'.ucf_text input').val();

this 未正确转换为字符串。

试试：

var t=$(this).find('.ucf_text input').val();

【参考方案2】：

var t=$(this +'.ucf_text input').val();

您正在尝试将字符串与 DOM 节点连接起来。 我假设你想要每一行的孩子？这将是：var t=$(this).find('.ucf_text input').val();

【参考方案3】：

您不能连接 DOM 对象和字符串。

您可以通过将this 指定为选择器的上下文 轻松解决此问题：

var t = $('.ucf_text input', this).val();

通过这样做，选择器仅匹配给定上下文中的元素，即您的情况下的表格行。

【参考方案4】：

您已经得到了 2 个正确答案，但为了多样化，这里有另一种方法：

var t = $('.ucf_text input', this).val();

【参考方案5】：

其实这是因为$(this)[tr]没有.ucf_text这个类

我认为你的意思是它下面的 td

添加一个空格来表示您的意思是孩子。 :)

var t=$(this +' .ucf_text input').val();
               ^ Space!

编辑： 还是不行！

var t=$(this).children('.ucf_text').children('input').val();

Find 更酷，但我正在编辑是为了不留下错误的答案，并且希望有点原创，此外...也许您需要一条不同的输入路径？

【讨论】：

好电话。 this 是一个 htmlDomElement 和所有...编辑是为了尊严，而不是为了代表

哈！我不值得......我的代码需要大约 8B 更多的存储内存，并且可能需要整个 256B 的 RAM 来处理，导致性能下降大约 0.0081 毫秒