Question

所以我正在使用HTML，CSS，JavaScript和AngularJS创建一个Web应用程序。到目前为止，我有一个盒子里面有一些内容。单击该框时，我调用javascript函数显示更多框，我使用ng-click执行此操作。

<div ng-click="!(clickEnabled)||myFunction(app)" class ="box">
   *** things displyaed inside the box ***        

</div>

clickEnabled的值（true或false）确定是否调用myFunction（）并且此部分完美运行。 clickEnabled为false时禁用ng-click。现在的问题是，在我的css文件中，我有我的.box类，当我将鼠标悬停在框上时光标是指针，并且框的背景也会在悬停时发生变化。有没有办法制作光标：默认并使它在禁用ng-click或clickEnabled为false时不会改变框的背景颜色？

以下是我的css代码示例

     .box {
          border: 1px solid lightgray;
          padding: 10px;
          border-radius: 5px;
          border-color: white;
          box-shadow: 0 0 5px gray;
          cursor: pointer;
          background: #353131;
          border-width: 2px;
          display: inline-block;
          width: 300px;
          height: 150px;
    }

   .box:hover {
       background-color: dimgrey;
       border-color: grey;
    }

同样，当clickEnabled false/ng-click为disabled时，我不希望光标成为指针。在此先感谢：）

Answer 1

您可以尝试使用ng-class

<div ng-click="!(clickEnabled)||myFunction(app)" ng-class="{no-cursor: !clickEnabled}" class="box" >
   *** things displyaed inside the box ***        

</div> 

.box.no-cursor {
  cursor: default;
}

如果条件为真，则更改悬停属性

1 个答案: