获取没有公共类Jquery的div的索引

时间:2016-08-08 08:44:42

标签: javascript jquery

您好我只想得到没有上课的div的索引"已经"这是我的代码。

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

这是我的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>

我总是得到的结果为零。提前谢谢大师!

3 个答案:

答案 0 :(得分:1)

您需要获取所有组合元素的集合中的元素索引:

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

<强> Working Demo

答案 1 :(得分:1)

有多个TableLayoutPanel没有班级Dock

您的解决方案中包含TableLayoutPanel,它将返回一个只包含1个对象的数组。这将记录没有类Bottom的每个元素的索引:

div

答案 2 :(得分:1)

您需要根据获取索引所需的集合进行指定。

// 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>

检查documentation of index()方法以获取更多信息。