Question

我正在尝试删除菜单上悬停的元素上方兄弟的边框底部。我不知道我是否使用了错误的功能或是否是其他问题。感谢您的任何反馈。

jQuery的：

jQuery(document).ready(function(){
  $('#nav_1487666 li a').mouseover(function(){
      $(this).prev().css("border-bottom", "none");
  });
});

HTML：

<ul id="nav_1487666">
    <li><a href="/index">Home</a></li>
    <li><a href="#">About</a></li>
    <li><a href="#">Landscaping</a></li>
    <li><a href="#">Irrigation</a></li>
    <li><a href="#">Porous Pave</a></li>
    <li><a href="#">Demo Dumpsters</a></li>
    <li><a href="#">Other Services</a></li>
    <li><a href="#" onclick="return false;">Lawn Care</a></li>
    <li><a href="#" onclick="return false;">Contact</a></li>
</ul>

Answer 1

更改

$(this).prev().css("border-bottom", "none");

到

$(this).parent().prev().css("border-bottom", "none");// To remove border from li

或

$(this).parent().prev().find('a').css("border-bottom", "none");// To remove border from a

Answer 2

假设边界在li上，就像这样 -

#nav_1487666 li{
border: 1px solid red;
margin: 5px;
}

然后将您的jquery选择器更改为

$('#nav_1487666 li').mouseover(function(){
  $(this).prev().css("border-bottom", "none");
});

检查fiddle

jQuery - 从前一个兄弟元素中删除边框

2 个答案: