Question

我正在使用以下代码，并且一切都很好，直到我尝试在div菜单ID中添加一个类。当我添加类时，类包含的图像变得不可见，我知道它与当前的Jquery代码有关但我找不到解决方案。

原创HTML代码：

<div id="menu_container">  
    <div id="menu_CyclopeanCity">
        <h2>A Cyclopean City of No Architecture</h2>
        <a href="images/recent/1.jpg" rel="lightbox [1]" title="A Cyclopean City of No Architecture">
            <span class="roll"></span>
            <img src="images/recent/1.jpg" class="slider"  />
        </a>
        <p>A Cyclopean City of No Architecture Known to Man is a vertical heavily-textured painting on canvas-board that incorporates found objects, collage, 
                crack-filler, and oil paint. The composition is simple, consisting of a gradient background, a rough pyramidal shape in the middle-ground, and a framed 
                photograph in the foreground. The texture on the pyramid and photographic frame is built up of heavily applied with a type of durable, all-purpose 
                crack-filler. 
        </p>
        <br><br>
        <p><strong id="price">Price:</strong><span class="bullets">R11 650</span></p>
        <p><strong>Painting Status:</strong><span class="bullets">Available</span></p>
        <p><strong id="date-painted">Date Painted:</strong><span class="bullets">2013</span></p>
     </div>
 </div>

原始JS代码：

$(document).ready(function(){
    $("#menu_container div:first-child").show();
    $("#nav a").click(function(){
        var id =  $(this).attr('id');
        id = id.split('_');
        $("#menu_container div").hide(); 
        $("#menu_container #menu_"+id[1]).fadeIn();
    });
});

这是一个工作的JS小提琴，将div类作为父类添加到图像上，因为该类现在没有出现 - http://jsfiddle.net/9cAV3/

Answer 1

我认为你需要的是

$("#menu_container > div").hide();

而不是

$("#menu_container div").hide();

css同样的事情

#menu_container > div {
    display:none;
}

这将隐藏menu_container中的直接div，该div将定位<div id="menu_CyclopeanCity">。这样你的.parent div就不会被隐藏了。

您还可以为容器div添加一个类，以便直接定位div

$("#menu_container").find('.container_div').hide();

通过这样做，它比＆gt;更快一点。格

Jquery显示隐藏功能不显示图像

1 个答案: