Javascript 使用jqLite隐藏和显示html元素

像任何使用AngularJS创建web应用程序的普通人一样，我最初尝试使用ng hide/ng show使某些元素在特定条件下可见。出于某种原因，这不起作用，而且代码太复杂，我无法在此详述。我认为使用jQuery会很容易（或者至少与Angular内置的jQuery一样多）。这就是我到目前为止所做的：

angular.element(document.querySelector([ELEMENT ID])).off();

---

上面这条线是为了隐藏，但我永远也找不回来。如果你想知道，我正试图隐藏其他无关操作的按钮。对上述代码使用“.on（）”无效。为了使元素消失，需要如何写入这一行？更重要的是，如何使其重新出现？

为此，我们需要一个小型css：

.display-hide {
   display: none;
}

假设我们在页面上显示了一个验证摘要

<div class="alert alert-danger display-hide">
        <button class="close" data-close="alert"></button>
        <span>
            @Html.ValidationSummary(false)
        </span>
</div>

@Html.ValidationSummary（false）

并使用jQuery

jQuery(document).ready(function () {
   @if(!ViewData.ModelState.IsValid) {
       <text>
  $('.alert span').parent().removeClass("display-hide");
       </text>
   }
   else
   {
       <text>
  $('.alert span').parent().addClass("display-hide");
       </text>
   }
});

jQuery（文档）.ready（函数（）{
@如果（！ViewData.ModelState.IsValid）{
$（'.alert span'）.parent（）.removeClass（“显示隐藏”）；
}
其他的
{
$（'.alert span'）.parent（）.addClass（“显示隐藏”）；
}
});

---

您可以对任何html元素使用此技巧。

on

和

off

方法不是用于显示/隐藏元素，而是用于添加和删除事件侦听器。我想你的元素已经被隐藏了，这让你相信

关闭了
隐藏了元素

如果您真的不能使用
ng hide/ng show
我建议您使用
addClass
和
removeClass
（而不是
off
和
on
）向元素添加/删除“hidden”类。该类可以将元素
display
设置为
none

但是，我建议您显示角度代码，以便我们可以使用
ng show
ng show
和
ng hide
处理布尔值来帮助您解决此问题。不要在控制器内使用jQuery。如果需要使用它，请为此创建指令

在控制器的作用域中创建标志变量。将其设置为
true
或
false

现在，如果元素接收到布尔值，ng show将显示为true，如果接收到false，则将隐藏

反之亦然，对于ng hide，如果接收到true，它将隐藏，如果接收到false，则显示

所以，选择其中一个，不要同时使用两个。所以，考虑到标志名是活动的，它被设置为true，您希望在开始时显示按钮。代码可以是：

angular.module('demo', []).controller('DemoCtrl', function($scope){
  $scope.active = true;
});

模板将如下所示：

<div ng-app="demo">
  <div ng-controller="DemoCtrl">
    <button type="button" ng-click="active = false" ng-show="active">Hide Me</button>
    <button type="button" ng-click="active = true" ng-hide="active">Reset</button>
  </div>
</div>


把我藏起来
重置
您可以尝试addClass和removeClass。我让ng show和ng hide工作的唯一方法是，如果我将逻辑直接放在属性中（即ng show=false），尽管我收到了一条非常严厉的指令，不在视图中使用逻辑（MVC等）。更重要的是：我如何应用addClass/removeClass？你能给我举一个上面这行的例子吗？