Question

我遇到的问题是无法在'menuItem'类div中选择div。我已经尝试过使用jQuery选择器来选择类甚至ID，但每次我尝试用它做任何事情，比如动画时，都没有任何反应。是否有一些我不知道的jQuery法则阻止我这样做？

$('.menu')
    .hover( function() { 
        $(this).toggleClass('highlighted'); 
    })
    .click(function() {
        $(this).parent().children('.menuItem').children('#wtf').slideDown();
    });

还尝试了click（），但没有一个工作..

$('#wtf').slideDown();
$('.test').slideDown();
$(this).parent().find('.menuItem').each( function() { $(this).slideDown(); } );
$(this).parent().children('.menuItem').children().slideDown();

<div class='box'>
    <div>
        <div class='menu'>Resources</div>

        <div class='menuItem'>
            <div ID='wtf' class='test'>Library</div>
            <div>Internet</div>
            <div>Your mom</div>
        </div>
    </div>

    <div>
        <div class='menu'>Products</div>
    </div>

    <div>
        <div class='menu'>Contact</div>
    </div>
</div>

body { font-size: 16px; }

.box {
    background: blue; 
    border: 1px; 
    padding: 4 6 4 6; 
    position: absolute; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    border: 2px solid;
}

.box div {
    float: left; 
    text-align:center; 
}

.menu {
    background: lightblue;
    width: 105px;
    text-align: center;
    padding: 4 10;
    margin: 1 5;
    font-weight: bold;
    font-family:'Verdana', 'Times', serif; 
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border: 2px solid gray;
}

.highlighted {
    background: lime;
    color: navy;
}

.menuItem {
    clear: left;
    position: absolute;
    margin-top: 30px;
}

.menuItem div {
    display: none;
    background: lightblue;
    opacity: .7;
    filter: alpha(opacity=.7);
    width: 105px;
    text-align: center;
    padding: 4 10;
    margin: 1 5;
    font-size: 10px;
    font-family: 'Verdana', 'Times', serif; 
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border: 2px solid white;
    clear: left;
}

Answer 1

你试过吗？

$(this+' > .menuItem div')

Answer 2

我在你的风格中应用了背景颜色，你的jQuery选择器没有正确选择。我尝试了这个并改变了背景颜色，但我没有使用CSS来实现slideDown（）的可视化工作 - 你必须正确编写你的CSS。

$（本）.siblings（）发现（ “＃WTF”）的CSS（ “背景色”， “＃CCCCCC”）了slideDown（）; ...

选择器有问题

2 个答案: