Jquery 使用ng show时如何获取DOM元素的大小

全部：

我想知道如果我将元素的ng show设置为false，如何获得元素的宽度和高度

比如：

这一个只打印出50（如果我给出一个特定的像素数，它就会得到这个数字），我认为jQuery无法得到实际的计算值。但当我删除ng show并使用display时：无；然后jQuery可以得到正确的大小。因此，我猜ng show必须做一些额外的工作，以防止jQuery计算大小

有没有人能给出一个解决方案（只要我们能解决百分比的问题就行）

---

谢谢

当元素的

ng show

为false时，Angular会在设置

display:none

的元素上应用

ng hide

类

手动设置

display:none

的测试可能在某个地方有问题，因为JavaScript（因此jQuery）无法计算该元素的大小

如果确实需要在控制器中获取元素宽度，可以使用自定义的

移开

指令，而不是像这样使用

ng show

：

module.directive('moveAway', function() {
  return {
    restrict: 'A',
    link: function(scope, elem, attrs) {
      scope.$watch(attrs.moveAway, function(move) {
        if (move) {
          elem.addClass('moved-away');
        } else {
          elem.removeClass('moved-away');
        }
      });
    }
  };
})

然后添加以下CSS规则：

.moved-away {
  position: absolute;
  left: 100000px;
}

因此，元素不会被隐藏，而是被放在很远的地方，但保持其大小

---

注意：如果在获取绝对定位元素的大小时仍然存在问题（当宽度类似于

50%

而不是

50px

），则可以尝试

可见性：隐藏
或
不透明度：0.01
，但该元素仍将占据DOM中的相同位置（即使不可见）.
您还可以通过将元素的
可见性
属性设置为
隐藏
，将元素的
显示
属性设置为
块
或空来获取元素的维度。是的，我在添加注释的同时添加了该属性，但是行为会有所不同，因为当不可见时，元素将在DOM中占据一个位置，这可能是不需要的，因为这不会发生在
display:none
上。你是对的。但是可以将元素的
显示
属性更改为
块
，获取其尺寸并将其更改回
无
。我在中就是这么做的，到目前为止，我还没有看到任何副作用（例如闪烁）。@floribon谢谢，正如您所说：“您通过手动设置display进行的测试：在某些地方可能没有问题”，但是div确实被隐藏了，并且在我调整窗口大小时正确计算了宽度，让jQuery进行计算还有什么不对的吗？
module.directive('moveAway', function() {
  return {
    restrict: 'A',
    link: function(scope, elem, attrs) {
      scope.$watch(attrs.moveAway, function(move) {
        if (move) {
          elem.addClass('moved-away');
        } else {
          elem.removeClass('moved-away');
        }
      });
    }
  };
})

.moved-away {
  position: absolute;
  left: 100000px;
}