특정 li의 확인란 값 가져 오기

Question

다음 html 구조가 있습니다. 나는하여 <li> 선택할 수 있지만, 체크 박스 값을 얻을 수 없다 -는 각각 $ 내부 undefined

<ul> 
    <li class="selected" style="false"> 
     <label class=""> 
      <input type="checkbox" data-name="selectItem" value="2447"> 
      <span>England</span> 
     </label> 
    </li> 
</ul> 

$('ul li.selected').each(function() { 
    console.log('li.selected'); 
    var val = $(this).closest('label').find('[type=checkbox]').val(); 
    console.log(val);           
}); 

Answer 1

(이)의 리튬 요소이기 때문에이 시도 :

$('ul li.selected').each(function() { 
      console.log("li.selected"); 
      var val = $(this).find(":checkbox").val(); 
      console.log(val);           
     }); 

Answer 2

시도를 다음과 같이 코드를 변경 :

$('li.selected').each(function() { 
 
      console.log("li.selected"); 
 
      var val = $(this).find("label").find('input[type=checkbox]').val(); 
 
      console.log(val);           
 
     });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<li class="selected" style="false"> 
 
    <label class=""> 
 
      <input type="checkbox" data-name="selectItem" value="2447"> 
 
      <span>England</span> 
 
    </label> 
 
</li>

Answer 3

closest()이 DOM을 따라 올라가려면 대신 find()을 사용해야합니다. 또한 find()에 대한 단일 통화에서 필요한 것을 얻을 수 있습니다. 이 시도 :

$('ul li.selected').each(function() { 
    var val = $(this).find('label :checkbox').val(); 
    console.log(val);           
}); 

Answer 4

간단히 체크 박스를 검색 : val = $(this).find('input[type=checkbox]').val();

$('ul li.selected').each(function() { 
 
    console.log("li.selected"); 
 
    var val = $(this).find('input[type=checkbox]').val(); 
 
    console.log(val); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<ul> 
 
    <li class="selected" style="false"> 
 
    <label class=""> 
 
     <input type="checkbox" data-name="selectItem" value="2447"> 
 
     <span>England</span> 
 
    </label> 
 
    </li> 
 
</ul>

Answer 5

을 할 수 있습니다 직접 .find()$(this) 내 input type="checkbox" :

$('ul li.selected').each(function() { 
 
    console.log('li.selected'); 
 
    var val = $(this).find(':checkbox').val(); 
 
    console.log(val);           
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<ul> 
 
    <li class="selected" style="false"> 
 
     <label class=""> 
 
       <input type="checkbox" data-name="selectItem" value="2447"> 
 
       <span>England</span> 
 
     </label> 
 
    </li> 
 
</ul>