Question

我正在尝试遍历某些日期选择器字段并获取每个输入的ID。但警报显示为空白。

$(document).ready(function () {
    $.each($('.input-group.date'), function() {
        alert(this.id);
        alert($(this).val());
    });
});

HTML / Ruby代码如下：

<tr>
        <td class="label-date">Start Date</td>
        <td colspan="2"><%= date_select(f, :agent_start_on, {class: "form-control date"}) %></td>
        <td colspan="2"><%= date_select(f, :sales_start_on, {class: "form-control date"}) %></td>
        <td colspan="2"><%= date_select(f, :manager_start_on, {class: "form-control date"}) %></td>
        <td colspan="2"><%= date_select(f, :ceo_start_on, {class: "form-control date"}) %></td>
        <td colspan="2"><%= date_select(f, :region_start_on, {class: "form-control date"}) %></td>
      </tr>

当我检查Chrome中的元素时（这是第一个）：

<div class="form-group"><div class="input-group date  "><input class="form-control" id="loa_item_agency_effective_on" name="loa_item[agent_start_on]" placeholder="MM/DD/YYYY" type="text" value=""><span class="input-group-addon"><i class="fa fa-calendar"></i></span></div></div>

最终我想循环每个并获得它的价值。但我想我需要id才能这样做，因为看起来id是在运行时生成的？

Answer 1

你的每种方法都错了。实际上它就像

$('.input-group.date').each(function() {
  alert($(this).find('input[type=text]').val()); // get the input value
  alert($(this).find('input[type=text]').attr('id')); // get the input id
});

Answer 2

您正在尝试在其中获取div而非input的ID。使用下面的代码

$(document).ready(function () {
    $('.input-group.date').each(function() {
        var $input = $(this).find('input.form-control');
        alert($input.attr('id'));
        alert($input.val());
    });
});

编辑：关于输入的更改，您可以在代码下面使用

此代码将为您提供已更改日期选择器的ID。

$(document).on('change','.input-group.date input.form-control',function() {
        var $input = $(this);
       alert($input.attr('id'));
        alert($input.val());
    });

要在任何datepicker更改时获取所有datepicker的id，请使用下面的代码

$(document).on('change','.input-group.date input.form-control',function() {
       $('.input-group.date').each(function() {
            var $input = $(this).find('input.form-control');
            alert($input.attr('id'));
            alert($input.val());
        });
    });

Answer 3

你必须在元素上调用each()函数，例如：

$('#input').each( function(){
   alert($(this).attr('id'));
});

Answer 4

如果您不知道哪个输入是您想要的输入，并且您必须遍历它们，则可以使用此功能获取所有这些值。请记住正确放置表单选择器。有了这个，你可以拥有无论身份的价值，但如果你想要身份证，你可以打电话给.attr（＆＃39; id＆＃39;）。

_getFormData = function() {
  var values = {};
  $('#myForm :input').each(function() {
    this.name ? values[this.name] = $(this).val() : ""; // we don't need the submit button
    console.log(this.id); // CHECK THIS.
  });
  return values;
}

首先从浏览器中的控制台检查输入是否有值，您将有更好的机会知道发生了什么。在浏览器中按F12，在控制台选项卡中输入：

var el = $("#loa_item_agency_effective_on");
console.log(el.val())

也许你有父母和孩子，你需要获得其他元素的信息。

希望它有所帮助。

jquery循环遍历字段以获取id

4 个答案: