为什么element.style.left返回NaN？

Question

我收到一个奇怪的错误，在Internet Explorer 7中，当我在float上调用Math.round时，出现了“无效参数”错误。考虑以下内容：

var elementLeft = parseInt(element.style.left); // Here we're actually getting NaN
function Foo(x) {
  this.x = x;

  this.apply = function(element) {
    element.style.left = Math.round(this.x) + 'px';
  };
}
Foo(elementLeft);

在这种情况下，x是一个非负数，element只是我页面中的一个DOM元素（实际上是一个div）。

有什么想法吗？

EDIT：作为x参数传入的变量实际上早于parseInt(element.style.left)进行了初始化。看来我第一次尝试阅读element.style.left时，IE实际上是在回馈NaN。我已经更新了代码以反映这一点。有人知道任何解决方法吗？

Answer 1

[似乎是我第一次尝试读取element.style.left时，IE实际上正在退还NaN。

第一次阅读element.style.left时，元素上实际上设置了任何left样式吗？请记住，element.style仅反映内联style="..."属性中设置的样式属性，而不反映样式表应用的样式属性。

如果没有设置内联样式，则style.left将为您提供undefined对象，该对象的确将parseInt设为NaN。

Answer 2

IE是否默认将x设置为错误值？

向下滚动到this page上的项目10：

[Firefox，谷歌浏览器等。但我是在IE中有问题口味）。没有选择工具提出和一个JavaScript警告是告诉我有关提交给“无效的论点”Math.round函数。

原因是当您第一次点击图片开始选择，scaleX和scaleYjavascript中的变量页面结果为Infinity。Firefox和所有其他浏览器似乎默默地跨过这个正常处理。 IE当然没有。

解决方案是添加以下内容初始scaleX和计算scaleY变量。这个似乎已经解决了问题充分地。 if（scaleX == Infinity || scaleY== Infinity）返回false；我希望这可以帮助其他人并节省他们一个小时的狩猎花费了我； o）

Answer 3

我不认为是Math.round()会给您带来错误。可能是CSS子系统。在获得的值上尝试使用alert()。

Answer 4

某些框架（例如jQuery）具有读取元素calculated位置的功能-无需您在元素上显式设置CSS位置属性。尝试通过jQuery阅读元素的位置。可能有效。

Answer 5

出于某些原因，JavaScript仅适用于内联样式。例如

<div style="left:500px;"></div>

如果您希望处理元素的位置，请尝试在Java Script文件中设置初始位置，例如：

function Xyz() {
    var elem = document.getElementById('id');
    elem.style.left = 500px;
    numberLeft = 500;
    //Now you can manipulate the position
    var increment= 50;
    var newLeft = numberLeft + increment;
    elem.style.left = newLeft + 'px';
}

您明白了。输入您的逻辑。