-3

当我点击按钮将隐藏所有<div.main>（每个有 6 个将同时隐藏）。

HTML：

<body>
    <div class="container">
        <button>Hide</button><br />
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
        <div class="main"><img src="http://fc08.deviantart.net/fs46/f/2009/230/a/4/Spongebob_10_150x150_PNG_by_somemilk.png" /></div>
    </div>
</body>

CSS：

.container {
    width: 900px;
}
.main {
    float: left;
    width: 150px;
}

http://jsfiddle.net/XGkAt/

到那里怎么走？

4

3 回答 3

3

你可以做：

$("button").click(function() {
    $(this).parent().find('div.main').hide();
});

您可能应该为您的按钮添加一个 ID 或一个类。现在这将在任何时候触发button点击。

演示：http: //jsfiddle.net/XGkAt/1/

于 2013-06-28T14:25:38.393 回答
1 
$(your button).on('click', function() {
    $(this).parent().children('div.main').hide();
});

也许可以工作。

于 2013-06-28T14:25:46.683 回答
0

问题中提到了6。如果你想一次删除六个，下面应该做你所追求的（以一种公认的粗略方式）：

$(".container button").click(function() {
    for (var i = 0; i < 6; i++) {
        $("div.main:visible").first().hide(); 
    }
});

您显然需要 jQuery，它没有包含在您的原始 jsFiddle 中。

于 2013-06-28T14:34:48.163 回答