使用名称和jQuery通过索引获取ID值

Question

html

<input id="1" name="myText" type="text" value="20"/>
<input id="2" name="myText" type="text" value="30"/>
<input id="3" name="myText" type="text" value="40"/>

如何通过名称使用index获取 id 值？

以下代码片段不起作用：

var getVal = $('[name="myText"]').index(1);

- Shahid Ghafoor

---

你打错了，是var而不是vat。而且最好把tagName添加到选择器中。 - gdoron

Answer 1

jQuery将DOM元素像数组一样保存在集合中，因此您可以使用索引操作符（[]）获取元素，或者使用 :eq(n) `.eq(n)` 获取包装所需元素的jQuery对象。

$('input[name="myText"]:eq(1)').attr('id')

你应该说明你认为index(1)是第一还是第二：

$('input[name="myText"]:eq(0)').attr('id') // First
$('input[name="myText"]:eq(1)').attr('id') // Second

或：

$('input[name="myText"]')[0].id // First

- gdoron is supporting Monica

---

索引（1）意味着显然是第二个。 - Shahid Ghafoor

@ShahidGhafoor。并不是那么明显，CSS选择器使用1为基础索引... “请注意，由于JavaScript数组使用基于0的索引，因此这些选择器反映了这一事实。这就是为什么$('.myclass:eq(1)')会选择文档中具有myclass类的第二个元素，而不是第一个元素。相比之下，:nth-child(n)使用基于1的索引以符合CSS规范。” - gdoron

亲爱的，但这是JavaScript（jQuery）代码。意味着基于0的索引;-)开玩笑@gdoron - Shahid Ghafoor

Answer 2

如果您想获取第一个值，您可以使用过滤器并使用attr方法获取id属性的值。

var getVal = $('[name="myText"]:first').attr('id'); // first id

如果你需要选取集合中的其他元素，可以使用eq并选择以0为基础的元素。

var getVal = $('[name="myText"]:eq(1)').attr('id'); // second id

- tvanfosson

---

他想要第二个元素，而不是第一个。 - user672118

@dunsmoreb. 你怎么判断呢？ - gdoron

@dunsmoreb 可能是这样，但由于他还不正确地使用了 index，所以认为他也在使用基于 1 的索引并不是太过牵强。为了澄清起见，我已经表述清楚了。 - tvanfosson

Answer 3

我的回答涉及通过索引访问jQuery结果对象中的元素。您可以使用其他答案中提到的:eq等选择器。

但是，您可以使用.get(1)代替index。

var id = $('[name="myText"]').get(1).id;

等同于

var id = $('[name="myText"]:eq(1)').attr('id');

示例: http://jsfiddle.net/HackedByChinese/UmKw6/1/

第二种方法是首选，因为它意味着您从不离开jQuery结果对象，因此可以在一个语句中链接其他jQuery调用。

var id = $('[name="myText"]:eq(1)').css('color', 'red').attr('id'); // example of chaining jQuery methods. sets the text color to red and then returns the id.

- moribvndvs

---

get 返回的是 DOM 元素，而不是 jQuery 对象... 你会得到错误：TypeError: Object a has no method 'attr'。 - gdoron

这个答案是不正确的。.get()函数返回实际的DOM元素，因此您不能在其上使用jQuery的.attr()函数。你会得到一个语法错误。 - Anthony Grist

对我来说运行良好。请查看我附加的fiddle。 - moribvndvs