Как исправить NaN при преобразовании строки в число в JavaScript

Проблема с получением NaN вместо числа

Столкнулся с непонятной ситуацией при работе с формой. Пытаюсь получить значение из поля ввода и преобразовать его в число с помощью parseInt, но получаю NaN.

// HTML поле
<input type="number" id="userInput" placeholder="Введите число">

// JavaScript код
var num = parseInt(document.getElementById("userInput").value);

console.log(typeof(num)); // показывает number
console.log(num); // но выводит NaN

Ввожу в поле число 5, хочу прибавить к нему 3 и получить 8, но вместо этого получаю NaN. В чем может быть проблема? Тип данных показывает number, но значение остается NaN. Как правильно преобразовать значение из input в число?

У меня была такая же проблема. Код выполняется до того, как пользователь вводит данные. Постарайся обернуть это в обработчик события: document.getElementById("userInput").addEventListener('input', function() { var num = parseInt(this.value); console.log(num); }); Либо используй onclick, если нужно по кнопке. И не забудь про проверку isNaN()!

у меня такая же фигня была когда js изучал. скорее всего поле пустое когда код запускается. добавь trim() чтобы пробелы убрать: parseInt(document.getElementById("userInput").value.trim()). лучше parseFloat юзай если с дробными работаешь. и всегда через if(!isNaN(num)) проверяй перед использованием числа, иначе потом баги долго искать будешь

Сначала проверь что реально возвращает поле через console.log(document.getElementById(“userInput”).value) перед parseInt. Может там пустая строка или пробелы? Попробуй Number() вместо parseInt - с дробными числами часто работает лучше.