2012-02-12 2 views
1

jquery를 사용하면 값이없는 입력을 포함하는 첫 번째 div를 어떻게 찾을 수 있습니까?jquery - 빈 입력을 포함하는 첫 번째 div를 찾습니다.

<div class="field"> 
    <input type="text" value="12"> 
</div> 
<div class="field"> 
    <input type="text" value="13"> 
</div> 
<div class="field"> 
    <input type="text"> 
</div> 
<div class="field"> 
    <input type="text"> 
</div> 

$('.field input').filter('text[value=""]').parent().addClass('first_empty') 
+0

$ ('div.field 입력') .filter (' 입력 : 텍스트 [값 = ""] "). 필터 (': 첫 번째'). 부모() .css ('배경색', '녹색'); 이 데모에서는 –

답변

4

너무 가까웠습니다. 요소를 속성 선택 자에 추가하면 ':text[value=""]'도 작동합니다. 사용자 입력 입력이 value재산 아니라 value 속성에 영향을주기 때문에 DEMO

$('.field :input').filter('input:text[value=""]') 
        .parent(':first') 
        .addClass('first_empty'); 
+0

이 실제로 빈 입력을 가진 모든 div를 선택합니다. 단지 첫 번째 것이 아닌 –

+0

예, 내 부분에 대한 감독입니다. 결정된! – shaunsantacruz

+0

@alpacalips이 검사를 확장하여 빈 공백을 고려할 수있는 방법이 있습니까? 즉, 값에 공백 만있는 입력을 선택하는 것입니까? –

2

선택기가 작동하지 않습니다.

당신이 뭔가를 (내가 jQuery를 사용하지 않기 때문에 나는 일반 JS이 쓰고 있어요)가 필요합니다 :

function findFirstEmptyInput() { 
    var qsa = document.querySelectorAll(".field input"), l = qsa.length, i; 
    for(i=0; i<l; i++) { 
     if(qsa[i].value == '') return qsa[i]; 
    } 
    return false; 
} 
+1

+1은 속성과 속성의 차이를 나타냅니다. – shaunsantacruz

+0

-1은 작성자가 요청한 것처럼 jQuery를 사용하지 않기 때문에 -1입니다. – nopuck4you

+0

jQuery를 사용하는 대신 CSS 솔루션을 제공하기 위해 전에 하루에 +5를 얻었습니다. 삶에 대한 귀하의 견해를 수정하십시오. –

1
$('.field > input:text[value=""]').parent().addClass('first_empty'); 
관련 문제