Question

你好，你如何find element不在这个班级名称？

下拉-area__itemPage

我使用此但不能正常工作

＆＃13;

$("#drop-area").children("div").find(".drop-area__item:not('.drop-area__itemPage:first')")

＆＃13;

$("#drop-area").children("div").find(".drop-area__item")
    div#page1.drop-area__item.ui-droppable.drop-area__itemPage
    div#page2.drop-area__item.ui-droppable.ui-droppable-active
    div#page3.drop-area__item.ui-droppable.ui-droppable-active
    div#page4.drop-area__item.ui-droppable.ui-droppable-active
    div#page5.drop-area__item.ui-droppable.ui-droppable-active
    div#page6.drop-area__item.ui-droppable.ui-droppable-active
    div#page7.drop-area__item.ui-droppable.ui-droppable-active
    div#page8.drop-area__item.ui-droppable.ui-droppable-active
    div#page9.drop-area__item.ui-droppable.ui-droppable-active

＆＃13;

enter code here

Answer 1

这是一个片段，显示第一个孩子的选择，该孩子有一个班级而且没有另一个班级：

$("#drop_area").find("div.class1:not([class~='class3']):first").css("border", "5px blue solid");

.class1, .class2, .class3{
    display: inline-block;
    margin: 20px;
    width: 150px;
    height: 80px;
}
.class1 {
    background: teal;
}
.class2 {
    background: tomato;
}
.class3 {
    background: lightgreen;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="drop_area">
    <div class="class1 class3 class2">class1 class3 class2</div>
    <div class="class2">class2</div>
    <div class="class1 class2">class1 class2</div>
    <div class="class3 class1">class3 class1</div>
    <div class="class1">class1</div>
    <div class="class2">class2</div>
    <div class="class1 class2">class1 class2</div>
    <div class="class3 class1">class3 class1</div>
    <div class="class3">class3</div>
    <div class="class2">class2</div>
    <div class="class3 class2">class3 class2</div>
    <div class="class3 class1">class3 class1</div>
</div>
<div class="result"></div>

结果jquery语句如下所示：

$("#drop-area .drop-area__item:not('.drop-area__itemPage'):first")

Answer 2

我正在考虑你想要做什么，但是如果你想找到drop-area的第一个没有班级drop-area__itemPage的子div，你可以做到这一点：

$(function() {
  $("#drop-area").find(".drop-area__item").not('.drop-area__itemPage').first().css({
    'color': 'red'
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="drop-area">
  <div id="page1" class=".drop-area__item ui-droppable drop-area__itemPage">1</div>

  <div id="page2" class="drop-area__item ui-droppable ui-droppable-active">2</div>

  <div id="page3" class="drop-area__item ui-droppable ui-droppable-active">3</div>
</div>

Answer 3

首先选择所有相关元素，而不是使用类.drop-area__itemPage排除，而不是使用.eq(0)来选择第一个元素：

$('#drop-area div .drop-area__item.:not(.drop-area__itemPage)').eq(0);

使用jQuery选择不在类名中的第一个div

3 个答案: