Question

我已经为第一次点击选择（添加支票）div做了简单的功能，第二次点击它将被删除，我在其他情况下使用了“nearest（）”。没有。

请帮忙。

JS：=

var selected = $('.demo-select');
selected.click(function() {
    $(this).toggleClass('selected');
    if ($('.demo-select').hasClass('selected')) {
        //alert(1);
        $(this).append('<p class="test">check</p>');
    } else {
        //alert(2);
        $('.demo-select').closest('.test').remove();
    }
});

Answer 1

需要使用find()，因为您正在寻找一个后代元素而不是一个祖先元素（.closest()用于查找与传递的选择器匹配的祖先元素。）

$(this).find('.test').remove();

演示：Fiddle

Answer 2

您需要使用find()代替closet()

find（）：获取当前匹配元素集中每个元素的后代，由选择器，jQuery对象或元素过滤

closet（）：对于集合中的每个元素，通过测试元素本身并遍历DOM树中的祖先来获取与选择器匹配的第一个元素。

var selected = $('.demo-select');
selected.click(function() {
  $(this).toggleClass('selected');
  if ($('.demo-select').hasClass('selected')) {
    //alert(1);
    $(this).append('<p class="test">check</p>');
  } else {
    //alert(2);
    $(this).closest('.test').remove();
  }
});

.demo-select {
  border: 1px solid;
  height: 200px;
  width: 200px;
}
.test {
  color: red
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="demo-select"></div>
<div class="demo-select"></div>
<div class="demo-select"></div>

演示：http://jsfiddle.net/tharindukumara/3b4forzd/

Answer 3

使用find()来实现这一目标。由于closest()将遍历DOM树中的祖先，而不是其后代。

$('.demo-select').find('.test').remove(); //OR simply $(this).find('.test').remove()

<强>更新

对于多个元素，请使用$(this)

var selected = $('.demo-select');
selected.click(function() {
    $(this).toggleClass('selected');
    if ($(this).hasClass('selected')) { //HERE $(this)
        //alert(1);
        $(this).append('<p class="test">check</p>');
    } else {
        //alert(2);
        $('this').find('.test').remove(); //HERE $(this) and find()
    }
});

Answer 4

closest会让你成为最亲近的祖先。您应该使用find获取.test：

var selected = $('.demo-select');
selected.click(function () {
    $(this).toggleClass('selected');

    if ($('.demo-select').hasClass('selected')) {
        $(this).append('<p class="test">check</p>')
    } else {
        $(this).find('.test').remove();
        //^^^^^^^^^^^^^^^^^^^
    }
});

演示：https://jsfiddle.net/tusharj/16dsa65j/4/

find：

获取当前匹配元素集中每个元素的后代，由选择器，jQuery对象或元素过滤。

文档：http://api.jquery.com/find/

修改

对于多个元素：

演示：http://jsfiddle.net/tusharj/16dsa65j/9/

Answer 5

您需要find元素，而不是对元素进行最接近的选择。

$('.demo-select').find('.test').remove();

“nearest（）”在其他条件下不起作用

5 个答案: