[jquery] div 요소의 모든 자식 입력을 얻는 방법 (jQuery)

HTML :

<div id="panel">
  <table>
    <tr>
       <td><input id="Search_NazovProjektu" type="text" value="" /></td>
    </tr>
    <tr>
       <td><input id="Search_Popis" type="text" value="" /></td>
    </tr>
  </table>
</div>

특정 div의 모든 입력을 선택해야합니다.

작동하지 않습니다.

var i = $("#panel > :input");



답변

다음보다 큰 값으로 사용하십시오 :

$("#panel :input");

>수단에만 직접 모든 아이들이 더 깊이 상관하지 않으 요소의 아이들은 단지 공간을 사용합니다.


답변

당신은 필요

var i = $("#panel input"); 

또는 , 정확히 원하는 내용에 따라 (아래 참조)

var i = $("#panel :input"); 

>모든 자손을 원하는, 아이들에게 제한됩니다.

편집 : Nick이 지적했듯이 $("#panel input")와 사이에는 미묘한 차이가 $("#panel :input)있습니다.

첫번째가 아니라 형 입력 요소 검색 할 <input type="...">수 있지만 <textarea>, <button><select>소자. 고마워 Nick, 나 자신을 몰랐고 그에 따라 내 게시물을 수정했습니다. OP가 그것을 알지 못하고 기술적으로 입력을 요구했기 때문에 두 옵션을 모두 남겨 두었습니다 … 🙂


답변

‘find’메소드는 이미 캐시 된 컨테이너의 모든 하위 입력을 가져 와서 다시 검색 할 수 있도록하는 데 사용될 수 있습니다 ( ‘children’메소드는 즉시 하위 만 가져옵니다). 예 :

var panel= $("#panel");
var inputs = panel.find("input");


답변

Ruby on Rails 또는 Spring MVC와 같은 프레임 워크를 사용하는 경우 대괄호 또는 다른 문자가있는 div를 사용해야 할 수도 있지만 사용할 수 없으며 document.getElementById동일한 유형의 입력이 여러 개인 경우이 솔루션은 여전히 ​​작동합니다.

var div = document.getElementById(divID);
$(div).find('input:text, input:password, input:file, select, textarea')
        .each(function() {
            $(this).val('');
        });
$(div).find('input:radio, input:checkbox').each(function() {
    $(this).removeAttr('checked');
    $(this).removeAttr('selected');
});

이 예제는 입력을 지우는 방법을 보여줍니다. 예를 들어 입력을 변경해야합니다.


답변

var i = $("#panel input");

작동해야합니다 🙂

>는 직접적인 어린이 만 가져오고, 어린이의 어린이
는 없습니다 . : 호버 등

의사 클래스의 사용 가능한 CSS 선택기에 대한 내용은 여기를 참조 하십시오. http://docs.jquery.com/DOM/Traversing/Selectors#CSS_Selectors


답변

여기 내 접근 방식이 있습니다 :

다른 이벤트에서 사용할 수 있습니다.

var id;
$("#panel :input").each(function(e){
  id = this.id;
  // show id 
  console.log("#"+id);
  // show input value 
  console.log(this.value);
  // disable input if you want
  //$("#"+id).prop('disabled', true);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="panel">
  <table>
    <tr>
       <td><input id="Search_NazovProjektu" type="text" value="Naz Val" /></td>
    </tr>
    <tr>
       <td><input id="Search_Popis" type="text" value="Po Val" /></td>
    </tr>
  </table>
</div>


답변