Question

我有一个列表，每个列表都包含一个链接和一个图像。有些图像有一类其他图像没有。

<ul>
  <li>
    <a>link 1</a>
    <img src="http://foo.com/" />
  </li>
  <li>
    <a>link 2</a>
    <img src="http://foo.com/" />
  </li>
  <li>
    <a>link 3</a>
    <img src="http://foo.com/" class="myClass" />
  </li>
</ul>

我希望在悬停这些链接时执行某些操作，但前提是相关图像具有该类。

这就是我目前正在尝试的事情：

$('ul li a').hover(
    function() {
        if ($(this).siblings('img').hasClass('.myClass')) {
                console.log('it has the class');
        }
});

这个的正确语法是什么？

Answer 1

您不应将.传递给hasClass方法，将其删除。

if ($(this).siblings('img').hasClass('myClass')) {

如果未动态添加/删除类，您还可以使用.filter()方法：

$('ul li a').filter(function() {
    // return $(this).siblings('img').hasClass('myClass');
    return this.nextElementSibling.className.indexOf('myClass') > -1;
}).hover(function(){
    // ...
});

或+ adjacent selector。

如果兄弟元素hasClass，请在悬停时执行某些操作

1 个答案: