Javascript 在角度引导中禁用表格悬停在特定行上

我有一个显示可选信息的表格。有时会有可选择的子行

如果没有子行，我希望父行可以选择，否则只有子行可以选择。这是一个仅选择一种类型的表

这张桌子工作正常。但是，我想在不可选择的父行上禁用悬停

这是一个正在工作的plunker：

以下是控制器中一些代码的示例：

    scope.parentSelected = [];
$scope.childSelected = [];

$scope.getParentDetails = function(parentObj) {
  if(!parentObj.jobs || parentObj.jobs.length === 0) {
    nonSelectOtherRows(); 
    var index = $scope.pro.indexOf(parentObj);
    $scope.parentSelected[index] = !$scope.parentSelected[index];

    // get details for parent row using parentObj
    console.log(parentObj);
  } 
};

$scope.getChildDetails = function(parentObj, childObj) {
  nonSelectOtherRows();
  var parentIndex = $scope.pro.indexOf(parentObj);
  var childIndex = parentObj.jobs.indexOf(childObj);
  $scope.childSelected[parentIndex] = [];
  $scope.childSelected[parentIndex][childIndex] = !$scope.childSelected[parentIndex][childIndex];

  // get details for parent and child rows using parentObj and childObj.
  // childObj is the childRow selected
  console.log(parentObj);
  console.log(childObj);
}

---

删除

表格悬停

属性

实现

ng mouseover

和

ng mouseleave

功能

$scope.hoverIn = function(row){
   row.hoverEdit = true;//check selectable or not
};
$scope.hoverOut = function(row){
   row.hoverEdit = false;
};

为悬停定义css类

.custom-hover {
  background-color: red;
}

最后将类添加到您的

tr

`'custom-hover': x.hoverEdit`

这是：

---

将可选控件添加到hoverIn中，它将起作用。

尝试使用ng类。这将对您有所帮助。

您是否有机会展示可选择控件的移动如何改变悬停的工作方式？当我试图移动我的控件时，它会打断悬停。我不明白你的情况。定义一个方法并选中可选或不可选。您只需在hoverin函数中添加：if（IsRowSelectable（row））row.hoverEdit=true；else行。hoverEdit=false；如果有帮助的话，如果你点击每一行，你可以看到哪些是可选择的，哪些不是。下面有填充的父行不可选择。是否要在可选择的子行上也应用悬停类，还是仅在可选择的父行上应用悬停类？另外，当您将鼠标悬停在可选择的父/子行上时，会发生什么情况？当前，选定的

类（黄色背景）应用于选定的父/子行。@Saad我想在所有可选元素上应用悬停类，包括子行和可选父行。现在，当我选择一个父/子行时会发生什么呢？当我选择的时候，它会返回数据，这个功能运行得很好。如果它能解决您的问题，请告诉我。@Saad Yes！你再次感谢我