如何获得下一个元素的值 - jquery

Question

我有div这样：

<div id="div_more_info">
    <input placeholder="title" name="title_info" class="title_info" style="margin: 1px" type="text">
    <input placeholder="des" name="des_info" class="des_info" style="margin: 1px;margin-left: 24px" type="text">

    <input placeholder="title" name="title_info" class="title_info" style="margin: 1px" type="text">
    <input placeholder="des" name="des_info" class="des_info" style="margin: 1px;margin-left: 24px" type="text">
</div>

现在我想得到我的div的每一行title - value：

$("#div_more_info .title_info").each(function () {
    var title_info = $(this).val();
    var des_info = $(this).next().find('.des_info').val();

    alert(title_info);
    alert(des_info);
});

我的代码显示title_info值，但des_info显示为未定义。

Answer 1

不需要.find()，只有.next()才能到达.des_info节点。

而不是

var des_info = $(this).next().find('.des_info').val();

使用

var des_info = $(this).next('.des_info').val();

Answer 2

Kartikeya Khosla解决方案或可以使用：

var des_info = $(this).next().val();

Answer 3

只需使用jquery的next()函数。

更新了脚本：

$("#div_more_info .title_info").each(function () {
  var title_info = $(this).val();
  var des_info = $(this).next().val();

  alert(title_info);
  alert(des_info);
});

Fiddle Link

Answer 4

你可以保持这个简短：

  $(".title_info,.des_info").each(function() {
      alert($(this).val());
  });