0

我正在尝试使用以下代码在 UI 中获取用户输入的值

$.each($('item'), function(i, v) {
  var test = new Object();
  test.attribute = $("#Attribute_" + i).val();
  test.operand = $("#Operand_" + i).val();
  test.value = $("#Value_" + i).val();
});

我的 HTML 代码

<div class="item">
    <input id="Attribute_0" name="Attribute_1" type="text">
    <select id="Operand_0">
    <input id="Value_0" type="text">
</div>

    <div class="item">
        <input id="Attribute_1" name="Attribute_1" type="text">
        <select id="Operand_1">
        <input id="Value_1" type="text">
    </div>

只要我的 ID 以 0 开头，一切正常(Attribute_0,Operand_0).

但是如果它以 1 或更高开头，则上述函数不起作用，因为 .each i 值以 0 开头。

如果 HTML 开始像 

 <div class="item">
                <input id="Attribute_1" name="Attribute_1" type="text">
                <select id="Operand_1">
                <input id="Value_1" type="text">
            </div>

并且得到 Null

可能有很多其他方法来获取值，但目前我实现了这一点，并希望通过一些修改坚持相同的代码。

我该如何处理？

谢谢

4

3 回答 3

3

更改您的 HTML 以使用类而不是 ID：

<div class="item">
    <input class="attribute" name="Attribute_1" type="text">
    <select class="operand">
    <input class="value" type="text">
</div>

然后使用类选择器 +.children获取对当前元素的引用.item：

$('.item').each(function() {
  var $this = $(this);
  var test = {
    attribute: $this.children('.attribute').val(),
    operand: $this.children('.operand').val(),
    value = $this.children('.value').val()
  };
});

或者，如果表单元素的顺序始终相同（属性、操作数、值），您可以按位置访问子项（不使用任何类或 ID）：

$('.item').each(function() {
  var $children= $(this).children();
  var test = {
    attribute: $children.eq(0).val(),
    operand: $children.eq(1).val(),
    value = $children.eq(2).val()
  };
});
于 2013-05-16T07:50:17.450 回答
2

如果您坚决反对更改标记，这应该可以解决问题。查看“属性开始于”选择器的 jQuery 文档

$('.item').each(function() {
  var $this = $(this),
      test  = {
        attribute : $this.find('[id^="Attribute_"]').val(), 
        operand   : $this.find('[id^="Operand_"]').val(),
        value     : $this.find('[id^="Value_"]').val()
      };
});

JSFiddle

于 2013-05-16T07:49:43.353 回答
0

你可以通过两种方式做到这一点，即。

解决方案1：

test.attribute = $(this).find("input[id^='Attribute_']").val();
test.operand = $(this).find("select[id^='Operand_']").val();
test.value = $(this).find("input[id^='Value_']").val();

解决方案 2 为属性、操作数和值标记分配一个类，并使用下面提到的代码定位该控件：-

test.attribute = $(this).find(".AttributeTag]").val();
test.operand = $(this).find(".OperandTag").val();
test.value = $(this).find(".ValueTag]").val();

希望这可以帮助。如果您想对此解决方案进行更多说明，请告诉我。

于 2013-05-16T07:53:21.053 回答