如何在jQuery中选择特定的表单元素？

Question

我有两个这样的形式:

<form id='form1' name='form1'>
  <input name='name' id='name'>
  <input name='name2' id='name2'>
</form>

<form id='form2' name='form2'>
  <input name='name' id='name'>
  <input name='name2' id='name2'>
</form>

现在我想在form2的name字段中插入文本.我使用以下jQuery代码,但它填写form1的名称字段.

$("#name").val('Hello World!');

那么如何只选择特定的表单元素呢？

Answer 1

两次使用相同的ID无效,这就是为什么#name只找到第一个ID .

你可以试试:

$("#form2 input").val('Hello World!');

要么,

$("#form2 input[name=name]").val('Hello World!');

如果您遇到无效页面并想要选择所有#names,则可以在id上使用属性选择器:

$("input[id=name]").val('Hello World!');

Answer 2

虽然它是无效的html但你可以使用选择器上下文来限制你的选择器在你的情况下它会像:

$("input[name='name']" , "#form2").val("Hello World! ");

http://api.jquery.com/jquery/#selector-context

Answer 3

我更喜欢＃form2的ID后代选择器，如下所示：

$("#form2 #name").val("Hello World!");

http://api.jquery.com/descendant-selector/