Question

我正在使用Jquery UI标签，并希望在鼠标悬停时更改元素的属性。

我的HTML是这样的：

<ul id="sub-tabs"> <li><a href="#000">000 General</a></li> </ul>...

jquery是：

$('#guide-nav ul#sub-tabs span').mouseover(function() {
   $("#guide-nav ul#sub-tabs li p").css("display", "none"); 
});

但这不起作用。

Answer 1

<ul id="sub-tabs">
    <li><a href="#000"><span>000<br /><p id="ct1">General</p></span></a></li>
</ul>

Jquery是：

$('#guide-nav ul#sub-tabs span').mouseover(function() {
   $("#guide-nav ul#sub-tabs li a span p").css("display", "none"); 
});

或试试这个：

$('#guide-nav ul#sub-tabs span').mouseover(function() {
   $("p#ct1").css("display", "none"); 
});

或者这个：

$('#guide-nav ul#sub-tabs span').mouseover(function() {
   $(this).find('p').css("display", "none"); 
});

Answer 2

使用此

$('#guide-nav ul#sub-tabs span').mouseover(function() {
   $("#guide-nav ul#sub-tabs li p").css({display:"none"}); 
});

Answer 3

好的，我把它包装在一个函数中，它可以工作......

$(function() {                                             
    $('#guide-nav ul#sub-tabs li a span').mouseover(function() {
        $(this).find('p').css("display", "none"); 
    });
});

我决定使用上面的语句只隐藏所选标签中的元素，因为会有倍数

Answer 4

当我尝试你的代码时它实际上是有效的。在执行javascript时，你确定DOM已经完成加载吗？

$(document).ready(function() {
  $('#guide-nav ul#sub-tabs span').mouseover(function() {
    ("#guide-nav ul#sub-tabs li p").css("display", "none");
  });
});

您也可以使用.css("display", "none");

代替.hide()

使用JQuery更改CSS属性

4 个答案: