Question

这听起来很容易，但我似乎无法做到。这个想法是，当点击'a'标签时，检查它是否有一个名为'collapsed'的类。如果是，请更改'ul'背景（a标签是其中的一部分）。我不知道哪个'a'标签被点击了所以我不知道'ul'的id是它的一部分...我想我可以向上钻取找到父'ul'，但它是不工作。

HTML：

<ul class="some-class" id="some-id-1">  
   <a href="#" id="id-1">something</a>
   <li>  
      <a class="collapsed">something else</a>  
   </li>  
</ul>  

<ul class="some-class" id="some-id-2">  
   <a href="#" id="id-2">something</a>
   <li>  
      <a class="collapsed">something else</a>  
   </li>  
</ul>  

<ul class="some-class" id="some-id-3">  
   <a href="#" id="id-3">something</a>
   <li>  
      <a class="collapsed">something else</a>  
   </li>  
</ul>

我的剧本：

$('a').click(function() {  
   var cName = this.className;  
   switch(cName) {
      case 'collapsed' :
         $(this).parent().find('> ul').css('background','url(img/red.png) 0 0');
      break;
   };
});

我做错了什么？欢迎提出任何建议......

Answer 1

尝试以这种方式使用JQuery的closest函数 -

$('a').click(function() {  
   var cName = $(this).attr('class');  
   if(cName == 'collapsed') {
        $(this).closest('ul').css('background','url(img/red.png) 0 0');
   };
});

Answer 2

首先，this应该像$(this)一样使用。

$('a').click(function() {
   // Change the first .collapsed element next to the clicked a
   $(this).next('.collapsed').css('background-color', 'url(img/red.png) 0 0');
});

如何更改背景图像？

2 个答案: