J'ai inclus le code donné

<ul class="checkboxes">
  <li class=" ">
    <label title="" for="option-0">
      <input type="checkbox" aria-selected="true" title="" value="All" name="country" id="option-0"><i>All</i>
    </label>
  </li>
  <li class=" ">
    <label title="" for="option-1">
      <input type="checkbox" title="" value="1" name="country" id="option-1" aria-selected="true"><i>test</i>
    </label>
  </li>
  <li class=" ">
    <label  title="" for="option-2">
      <input type="checkbox" title="" value="2" name="country" id="option-2" aria-selected="true"><i>abcd</i>
    </label>
  </li>
  <li class=" ">
    <label  title="" for="option-3">
      <input type="checkbox" title="" value="3" name="country" id="option-3" aria-selected="true"><i>loreum</i>
    </label>
  </li>
  <li class=" ">
    <label  title="" for="option-4">
      <input type="checkbox" title="" value="4" name="country" id="option-4" aria-selected="true"><i>ipsum</i>
    </label>
  </li>
</ul>

Je veux récupérer les valeurs vérifiées de la liste, par exemple: si j'ai sélectionné ipsum loreum et testez comment je vais récupérer ces textes via jquery. Sil te plait aide moi. Merci d'avance

1
Dinshaw Raje 10 juil. 2015 à 14:55

3 réponses

Meilleure réponse

Vous pouvez utiliser la fonction .map() sur tous les éléments cochés pour renvoyer un tableau de texte à partir de l'élément frère i:

$('ul input:checked').map(function(){
   return $(this).next('i').text();
}).get();

Démo de travail

4
Milind Anantwar 10 juil. 2015 à 11:57

Vous l'obtiendrez en utilisant jQuery Map

getValues = function(){
var values = $('input[name=country]:checked').map(function(){
			return $(this).val();
		}).get();
  alert(values);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="checkboxes">
  <li class=" ">
    <label title="" for="option-0">
      <input type="checkbox" aria-selected="true" title="" value="All" name="country" id="option-0"><i>All</i>
    </label>
  </li>
  <li class=" ">
    <label title="" for="option-1">
      <input type="checkbox" title="" value="1" name="country" id="option-1" aria-selected="true"><i>test</i>
    </label>
  </li>
  <li class=" ">
    <label  title="" for="option-2">
      <input type="checkbox" title="" value="2" name="country" id="option-2" aria-selected="true"><i>abcd</i>
    </label>
  </li>
  <li class=" ">
    <label  title="" for="option-3">
      <input type="checkbox" title="" value="3" name="country" id="option-3" aria-selected="true"><i>loreum</i>
    </label>
  </li>
  <li class=" ">
    <label  title="" for="option-4">
      <input type="checkbox" title="" value="4" name="country" id="option-4" aria-selected="true"><i>ipsum</i>
    </label>
  </li>
</ul>
      <input type="button" value="Get Values" onclick="getValues();">

Pour plus de détails, consultez API jQuery Map

1
Harshal Patil 10 juil. 2015 à 12:17

Vous voilà:

$('input').change(function() {
  var str = '';
  console.log($('input:checked').length);
  $.each($('input:checked'), function(index, value) {
    str += $(value).next('i').text() + ' ,';
  });
  alert('You checked: ' + str);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="checkboxes">
  <li class=" ">
    <label title="" for="option-0">
      <input type="checkbox" aria-selected="true" title="" value="All" name="country" id="option-0"><i>All</i>

    </label>
  </li>
  <li class=" ">
    <label title="" for="option-1">
      <input type="checkbox" title="" value="1" name="country" id="option-1" aria-selected="true"><i>test</i>

    </label>
  </li>
  <li class=" ">
    <label title="" for="option-2">
      <input type="checkbox" title="" value="2" name="country" id="option-2" aria-selected="true"><i>abcd</i>

    </label>
  </li>
  <li class=" ">
    <label title="" for="option-3">
      <input type="checkbox" title="" value="3" name="country" id="option-3" aria-selected="true"><i>loreum</i>

    </label>
  </li>
  <li class=" ">
    <label title="" for="option-4">
      <input type="checkbox" title="" value="4" name="country" id="option-4" aria-selected="true"><i>ipsum</i>

    </label>
  </li>
</ul>

J'espère que cela t'aides.

1
hungndv 10 juil. 2015 à 12:04