Question

我有一个id = level_1的div，我必须在id = level_1的div中隐藏所有类名为“child”的类。这是我的代码，但它不起作用。

<div id="level_1">
     <div class="child">1</div>
     <div class="child">2</div>
</div>

JQuery的：

$("#level_1 .child").hide();

编辑：

我想只看到点击的ID中包含的点击级别旁边的级别。

例如，当点击flip_0时，我想只看到id ='flip_0'中包含的level_2 div，而不是'flip_1'或'flip_2'等其他id中包含的level_2项。

我添加了Html和Jquery的完整代码：

<div class="flip level_1" id="flip_0">
    Level 1.1
</div>
<div>
    <div class="flip level_2 panel" id="flip_1">
        Item 1
    </div>
    <div class = "panel level_3" >
        Item 1.1
    </div>
    <div class= "panel level_3">
        Item 1.2
    </div>
    <div class = "flip level_2 panel">
        Item 2
    </div>
    <div class="flip level_3">
        Item 2.1
    </div>
    <div class="flip level_3">
        Item 2.2
    </div>
</div>
<div class="flip level_1" id="flip_2">
    Level 1.2
</div>
<div class="panel level_2">
    Item 2.1
</div>
<div class="panel level_2">
    Item 2.2
</div>

JQuery的：

$(document).ready(function(evt)
{
  $(".flip").click(function(evt)
    {

    var class_name_parts = evt.target.className.split("_");
    var level = parseInt(class_name_parts[1]);
    alert(level);
    for( var i= (level+1); i<=3; i++)
    {
        //alert("loop " + i);
        var x= ".level_"+i;
        $(x).hide();
    }
    alert("#"+evt.target.id+" "+".level_"+(level+1));
    $("#"+evt.target.id+" .level_"+(level+1)).show();/*toggle(50);, function()
    {
        var close = "."+evt.target.id + "_to_close";
        $(close).hide();
    });*/
});

}）;

Answer 1

你可以试试这个： -

  $(document).ready(function(){
           $("#level_1 .child").hide();
   });

您正在编写正确的代码，但可能是您在呈现div之前隐藏了内容。

Answer 2

Jquery仅在DOM模型准备好时才起作用。所以在创建DOM之后使用jquery代码会更好。为此，您可以使用$(document).ready()功能。在里面写你的代码。它只会在创建DOM时执行。

在Id javascript中选择一个类

2 个答案: