Bonjour je voulais juste obtenir l'index du div qui n'a pas de classe "déjà" c'est mon code.

 $('#slotMachine #slotMachine2 div.combi:not(.already):first').index();

Ceci est mon code html.

<li id="slotMachine2">
<div class="combi already" data-id="17">JOHN4654</div>
<div class="combi already" data-id="18">JOHN4015</div>
<div class="combi" data-id="19">JOHN1235</div>
<div class="combi already" data-id="20">JOHN0454</div>
<div class="combi already" data-id="21">JOHN1254</div>
<div class="combi already" data-id="22">JOHN0014</div>
<div class="combi already" data-id="23">JOHN1387</div>
<div class="combi already" data-id="24">JOHN2478</div>
<div class="combi" data-id="25">JOHN8475</div>
<div class="combi already" data-id="26">JOHN3597</div>
<div class="combi" data-id="27">JOHN7985</div>
<div class="combi already" data-id="28">JOHN3154</div>
<div class="combi already" data-id="29">JOHN9001</div>
<div class="combi already" data-id="30">JOHN0034</div>
<div class="combi already" data-id="31">JOHN0215</div>
<div class="combi already" data-id="32">JOHN3795</div>
<div class="combi" data-id="33">JOHN1567</div>
<div class="combi already" data-id="34">JOHN6523</div>
<div class="combi already" data-id="35">JOHN7956</div>
<div class="combi" data-id="36">JOHN1547</div>
<div class="combi already" data-id="37">JOHN6872</div>
<div class="combi already" data-id="38">JOHN3487</div>
<div class="combi already" data-id="39">JOHN8392</div>
<div class="combi already" data-id="40">JOHN3432</div>
<div class="combi already" data-id="41">JOHN3412</div>
<div class="combi" data-id="42">JOHN3413</div>
<div class="combi already" data-id="43">JOHN3419</div>
<div class="combi already" data-id="44">JOHN3423</div>
<div class="combi" data-id="45">JOHN3429</div>
<div class="combi" data-id="46">JOHN3427</div></li>

Le résultat que j'obtiens toujours est zéro. Merci d'avance maîtres!

1
Thomas Jericho Capuyan 8 août 2016 à 11:44

3 réponses

Meilleure réponse

Vous devez spécifier en fonction de la collection dont vous avez besoin pour obtenir l'index.

// cache the selector and based on this get index
var $col = $('#slotMachine #slotMachine2 div.combi');

console.log(
  // get the element within the collection to find index
  // and set it as `index()` methods argument
  $col.index($col.filter(':not(.already):first'))
);

// your code also works if there is siblings as in your html
console.log(
  $('#slotMachine #slotMachine2 div.combi:not(.already):first').index()
)


// or you can set the selector in which look for an element
console.log(
  $('#slotMachine #slotMachine2 div.combi:not(.already):first').index('#slotMachine #slotMachine2 div.combi')
)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="slotMachine">
  <li id="slotMachine2">
    <div class="combi already" data-id="17">JOHN4654</div>
    <div class="combi already" data-id="18">JOHN4015</div>
    <div class="combi" data-id="19">JOHN1235</div>
    <div class="combi already" data-id="20">JOHN0454</div>
    <div class="combi already" data-id="21">JOHN1254</div>
    <div class="combi already" data-id="22">JOHN0014</div>
    <div class="combi already" data-id="23">JOHN1387</div>
    <div class="combi already" data-id="24">JOHN2478</div>
    <div class="combi" data-id="25">JOHN8475</div>
    <div class="combi already" data-id="26">JOHN3597</div>
    <div class="combi" data-id="27">JOHN7985</div>
    <div class="combi already" data-id="28">JOHN3154</div>
    <div class="combi already" data-id="29">JOHN9001</div>
    <div class="combi already" data-id="30">JOHN0034</div>
    <div class="combi already" data-id="31">JOHN0215</div>
    <div class="combi already" data-id="32">JOHN3795</div>
    <div class="combi" data-id="33">JOHN1567</div>
    <div class="combi already" data-id="34">JOHN6523</div>
    <div class="combi already" data-id="35">JOHN7956</div>
    <div class="combi" data-id="36">JOHN1547</div>
    <div class="combi already" data-id="37">JOHN6872</div>
    <div class="combi already" data-id="38">JOHN3487</div>
    <div class="combi already" data-id="39">JOHN8392</div>
    <div class="combi already" data-id="40">JOHN3432</div>
    <div class="combi already" data-id="41">JOHN3412</div>
    <div class="combi" data-id="42">JOHN3413</div>
    <div class="combi already" data-id="43">JOHN3419</div>
    <div class="combi already" data-id="44">JOHN3423</div>
    <div class="combi" data-id="45">JOHN3429</div>
    <div class="combi" data-id="46">JOHN3427</div>
  </li>
</ul>

Consultez la documentation de la méthode index() pour plus d'informations.

1
Pranav C Balan 8 août 2016 à 09:09

Vous devez obtenir l'index de l'élément dans l'ensemble de tous les éléments combinés:

var combiDivs = $('#slotMachine2 div.combi');
var firstAlreadyIndex = combiDivs.index(combiDivs.filter(':not(.already)').first());

Démonstration de travail

1
Milind Anantwar 8 août 2016 à 08:48

Il existe plusieurs div sans la classe already.

Votre solution contient :first, qui renverra un tableau contenant seulement 1 objet. Cela enregistrera les indices de chaque élément sans la classe already:

$('#slotMachine #slotMachine2 div.combi').each(function(index, el) {
    if(!$(el).is('.already')) {
       console.log(index);
    }
});
1
PierreDuc 8 août 2016 à 08:49