jQuery的：第一個孩子（沒有ID或類）

這是HTML結構：（另見的jsfiddle這裏：http://jsfiddle.net/hQ5dZ/）jQuery的：第一個孩子（沒有ID或類）

<div id="fields">  
    <div> 
     <input type="file" /> 
     <input type="button" value="+add"> 
    <div> 
    <div> 
     <input type="file" /> 
     <input type="button" value="+add"> 
    <div> 
</div>

第二jQuery的語句下面是不行的，爲什麼呢？

$('#fields').children().hide(); 
$('#fields :first-child').show();

編輯：期望的行爲 - >第一個div孩子（及其內容）應該出現

來源

2013-10-28 Gabriel

其在鉻中爲我工作 –

您希望的行爲是什麼？ – nnnnnn

第一個div-child應該出現 – Gabriel

您沒有關閉div元素，而是創建新的div元素，導致#fields元素只有一個孩子。

所以$('#fields').children().hide()是隱藏孩子，然後$('#fields > :first-child').show()顯示它。

<div id="fields"> 
    <div> <!-- fc-1 --> 
     <input type="file" /> <!-- fc-2 --> 
     <input type="button" value="+add" /> 
    </div> <!--not closed--> 
    <div> 
     <input type="file" /> <!-- fc-3 --> 
     <input type="button" value="+add" /> 
    </div> 
</div> <!--not closed--> 

$('#fields').children().hide(); 
$('#fields > :first-child').show();

演示：Fiddle

另外，第二選擇器被更新，因爲#fields :first-child將選擇其是其父的第一個孩子#fields所有後代元素，在上述的標記，將選擇所有字段標記爲fc-x

來源

2013-10-28 09:38:59

我給你+1，因爲你通過添加'>'來修改選擇器，但是你可能想添加一個關於這個的解釋。（我知道它沒有它，但在我看來它是更正確的。） – nnnnnn

@downvoter我錯過了什麼 –

您的標記是無效的 - 你是不是關閉<div>和<input>標籤：

<div id="fields">  
    <div> 
     <input type="file" /> 
     <input type="button" value="+add" /> 
    </div> 
    <div> 
     <input type="file" /> 
     <input type="button" value="+add" /> 
    </div> 
</div>

在將標記更改爲有效的語法後，它正在工作 - http://jsfiddle.net/teddyrised/nBbxY/

來源

2013-10-28 09:38:30 Terry

哦，天啊！謝謝！ – Gabriel

除了關閉所需的標籤，你可以縮短你的jQuery代碼，像這樣，例如：

$('#fields').children().hide().eq(0).show();

在線工作示例：http://jsfiddle.net/nBbxY/1/

來源

2013-10-28 09:43:27 skip405

jQuery的：第一個孩子（沒有ID或類）

回答

相關問題