Question

我有两个div。 dvMapContainer作为整页背景工作并显示传单地图，dvEditContainer覆盖div，并在地图顶部显示一些控件。

代码是这样的：

<div id="dvMapContainer" style="height: 93%; width: 100%;position: absolute; top: 0; left: 0;"></div>

<div class="container" id="dvEditContainer">
    <div class="container-header">Update Inventory</div>
<div class="col-sm-4">

    <div class="form-group">
        <label for="plateNumber" class="col-sm-5 control-label">Plate #:</label>
        <div class="col-sm-7">
            <input type="text"
                   data-ng-model="bb.plateNumber"
                   name="plateNumber"
                   id="plateNumber"
                   class="form-control"/>
        </div>
    </div> 
 </div>

我想要发生的是当用户点击“Plate＃”标签时，它会隐藏整个dvEditContainer，但会显示标签。当用户再次单击标签时，dvEditContainer将再次可见。

我的jquery代码如下所示：

$(document).ready(function () {
            $('label').click(function (e) {
                var target = $(e.target);
                console.log(target);
                $('#dvEditContainer').hide();
                $(target).show();
            });
        });

然而，这会隐藏dvEditContainer，但不会显示标签。

任何想法或提示都将非常感激。

jsfiddle非工作代码。

Answer 1

您的<label>是不可见的，因为您只是隐藏了其父级。要么<label>可见，要隐藏除{{1}}之外的所有元素，或将{{1}}移至其他父级。

Answer 2

由于标签位于dvEditContainer div内的div内，因此它也被隐藏。

将表格组div移到dvEditContainer之外。

隐藏div中的所有元素（单击标签除外）以在后台显示div

2 个答案: