Question

<div class="ddown">
    <button class="dbtn">ABC</button>
</div>

我想在选中/取消选中复选框后进行div隐藏/显示，我该如何实现？

Answer 1

尝试以下代码

<input type="checkbox" ng-model="chkCondition">
<div class="ddown" ng-show="chkCondition">
    <button class="dbtn">ABC</button>
</div>

＆＃13;

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>

<div ng-app="">
    Check to show/Hide a div:
    <input type="checkbox" ng-model="chkCondition">
<div class="ddown" ng-show="chkCondition">
    <button class="dbtn">ABC</button>
</div>  
</body>
</html>

＆＃13;

Answer 2

<强> HTML

Answer 3

尝试使用ng-if来避免DOM元素的创建。

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>

<div ng-app="">
    <input type="checkbox" ng-model="isChecked">
<div class="ddown" ng-if="isChecked">
    <button class="dbtn">ABC</button>
</div>  
</body>
</html>

使div可见或不可见取决于条件

3 个答案: