Почему element.style.left возвращает NaN?

Question

Я получаю странную ошибку, когда в Internet Explorer 7, когда я вызываю 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).

Есть идеи?

РЕДАКТИРОВАТЬ: Переменная, переданная в качестве параметра 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 задано неправильное значение?

Прокрутите вниз до пункта 10 на этой странице :

Все работало нормально в Firefox, Google Chrome и т. Д. А я был возникли проблемы с IE (всего ароматизаторы). Ни один инструмент выбора не будет представил и предупреждение Javascript было произвел который рассказал мне о «Неверный аргумент» передается функция Math.round.

Причина была в том, что когда вы впервые нажмите на изображение, чтобы начать выбор, шкала X и шкала Y переменные в JavaScript на результат страницы в значении Бесконечности. Firefox и любой другой браузер кажется молча перешагнуть через это и нести на обработке как обычно. IE конечно не сделал.

Решением было добавить следующее строка после начального scaleX и переменные scaleY рассчитываются. это кажется, решил проблему от корки до корки. if (scaleX == Infinity || scaleY == Бесконечность) вернуть ложь; Я надеюсь, что это помогает кому-то еще и спасает их час охоты мне стоил; о)

Answer 3

Некоторые фреймворки, такие как jQuery, имеют средства для чтения вычисленных позиций элементов - без необходимости явно устанавливать свойства позиции CSS для них. Попробуйте прочитать положение вашего элемента через jQuery. Это может сработать.

Answer 4

Я не думаю, что Math.round() дает вам ошибку. Вероятно, это подсистема CSS. Попробуйте alert() на значение, которое вы получаете.