如何在打开另一个div时关闭div

Question

    <div id="select1" data="select">
    <span>Select Option</span>
</div>
<div toggle="select1" style="display: none">
    <table>
        <tr>
            <td valign="top" style="width: 165px">
                <input type="checkbox" name="vehicle" value="Bike" />
                option 1
            </td>
        </tr>
        <tr>
            <td valign="top" style="width: 165px">
                <input type="checkbox" name="vehicle" value="Car" />
                option 2
            </td>
        </tr>
        <tr>
            <td valign="top" style="width: 165px">
                <input type="checkbox" name="vehicle" value="dog" />
                option 3
            </td>
        </tr>
    </table>
</div>
<div id="select2" data="select">
    <span>Select Option</span>
</div>
<div toggle="select2" style="display: none">
    <table>
        <tr>
            <td valign="top" style="width: 165px">
                <input type="checkbox" name="vehicle" value="Bike" />
                option 1
            </td>
        </tr>
        <tr>
            <td valign="top" style="width: 165px">
                <input type="checkbox" name="vehicle" value="Car" />
                option 2
            </td>
        </tr>
        <tr>
            <td valign="top" style="width: 165px">
                <input type="checkbox" name="vehicle" value="dog" />
                option 3
            </td>
        </tr>
    </table>
</div>

jQuery的

<script type="text/javascript">
    $(document).ready(function () {
        $('[data="select"]').click(function () {
            var selectdiv = $(this);
            $('[toggle="' + selectdiv.attr('id') + '"]').toggle(); ;
        })
    })
</script>

我已经完成了div以上事件的发布。 如何设置该事件以关闭打开的div。 还需要在单击div或单击div以外的任何操作时关闭div

如果我打开一个div需要关闭另一个div怎么办呢？

实际产量

Answer 1

我认为您可以使用属性toggle隐藏所有元素，但必须打开的元素除外。

$(document).ready(function () {
    $('[data="select"]').click(function () {
        var selectdiv = $(this);
        var el = $('[toggle="' + selectdiv.attr('id') + '"]').toggle(); ;
        $('[toggle]').not(el).hide()
    })
})

演示： 小提琴