如何在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> 

現在我想在名窗口2的字段插入文本。我正在使用following jQuery code，但它填充了名稱字段form1。

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

那麼如何只選擇特定的表單元素呢？

Answer 1

兩次使用相同的ID無效，這就是爲什麼#name只能找到第一個。

你可以試試：

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

或者，

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

如果你堅持一個無效的頁面，並要選擇所有#name S，你可以在ID使用屬性選擇：

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

Answer 2

雖然它是無效的html，但你可以使用選擇器上下文來限制你的sel埃克特 在你的情況下，它會像：

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

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

Answer 3

$("#name", '#form2').val("Hello World") 

Answer 4

我喜歡你的＃窗口2的ID後代選擇，就像這樣：

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

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

Answer 5

我知道這個問題是關於設置一個輸入，但萬一如果你想設置一個組合框然後（我搜索網絡，沒有找到任何東西，這個地方似乎是一個正確的地方引導其他人）

如果你有一個ID屬性設置的表單（例如frm1）和 你想設置一個特定的組合框，沒有ID設置但名稱屬性設置（例如區）;然後用

$("#frm1 select[name='district'] option[value='NWFP']").attr('selected', true);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
    <form id="frm1"> 
 
     <select name="district"> 
 
      <option value="" disabled="" selected="" hidden="">Area ...</option> 
 
      <option value="NWFP">NWFP</option> 
 
      <option value="FATA">FATA</option> 
 
     </select> 
 
    </form>