Question

考虑以下HTML：

<form id="upvoteForm" method="post" action="/post/upvote">
    <input type="text" name="post_id" id="post_id"/>
</form>
<form id="downvoteForm" method="post" action="/post/downvote">
    <input type="text" name="post_id" id="post_id"/>
</form>

<input type="hidden" id="_postid" value="1"/>

我尝试使用此JavaScript和jQuery将名称为input的两个post_id字段设置为_postid的值：

$(document).ready(function() {
    $('#post_id').val($('#_postid').val());
});

但是，正如您可以看到in this jsFiddle，它只设置第一个的值。如何设置它们的值？我认为选择器最终会抓住两者。

现在，我意识到你可能想知道为什么我在这个页面上有两个表格。基本原因是我有button输入，我按照自己想要的方式设置了输入，但后来我使用onclick来调用相应表单的submit。我最终将在这里利用AJAX，但这会在稍后发布。

Answer 1

id始终是唯一的。你不能选择2个具有相同id的元素。按名称选择

$(document).ready(function() {
    $('input[name=post_id]').val($('#_postid').val());
});

Answer 2

拥有两个具有相同ID的HTML元素是非法的，并且会导致未定义的行为，例如您遇到的问题。但是，使用相同的名称是有效的。因此，您可以使用$('form > input[name=post_id]')这样的选择器，该input会在form内部查找name，post_id属性设置为{{1}}。

使用jQuery设置具有相同id的多个输入的值？

2 个答案: