特定の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()への1回のコールで必要なものを達成できることにも注意してください。これを試してみてください：

$('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>