如何在 jQuery 中使用“this”的子元素作为选择器

How do I use the child element of 'this' as a selector in jQuery?

本文关键字:元素 选择器 this jQuery      更新时间:2023-09-26

我有一个函数,当用户mouseover某个div时调用。该函数显示不同的div,但问题是它显示了该类的所有div。

这是JS:

$('.edit-image').mouseover(
  function(e){
  $('.edit-image-link').show();
});

我希望它做的是仅显示.edit-image-linkdiv,如果它是用户鼠标悬停的元素的子元素。

您可以使用 .find() 仅获取基于选择器的元素的后代元素。

$('.edit-image').mouseover(function (e) {
    $(this).find('.edit-image-link').show();
});

或者你可以将上下文传递给jQuery以搜索选择器

$('.edit-image').mouseover(function (e) {
    $('.edit-image-link', this).show();
});

注意:在像事件处理程序这样的jQuery回调方法中,这将引用当前的dom元素

我个人更喜欢第一种方法

使用

$('.edit-image').mouseover(function () {
    $(this).find('.edit-image-link').show();
});

引用

此关键字

.find()

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