Указанное значение "." не может быть проанализировано или находится вне диапазона

#javascript #dom

Вопрос:

Я пытаюсь создать калькулятор, но у меня проблема с «точкой», потому что дайте мне такую рекламу…

«Указанное значение «.» не может быть проанализировано или находится вне диапазона».

Это мой код…

 numberDot.addEventListener('click', function() {
    numberDot = '.' ;
    input.value = input.value   numberDot;
    console.log(typeof(input.value));
    console.log(input.value);
});

1. typeof — это оператор, а не функция, как typeof input.value и работа. 🙂

2. Где определяется или инициируется ввод ? Изначально numberDot ссылается на элемент (по-видимому), но затем ему присваивается значение «.». Вы уверены, что хотите выполнить это переназначение? Опубликуйте минимальный пример, демонстрирующий проблему с кодом в вопросе.

Ответ №1:

Это один из способов сделать это

Используйте type="number" входные данные и переключатели для выбора операции. Это помогает пользователю вводить числа. Вы также можете использовать type="text"

Важной частью является преобразование строковых данных в числовые значения

Когда вы считываете данные из свойства value входных данных, данные возвращаются в виде строки. Его можно преобразовать в число, используя parseInt (для целых чисел) или parseFloat (для чисел с плавающей запятой). Если оно не может быть проанализировано, NaN возвращается (не число). Для проверки NaN используйте isNaN() .

Например:

 let x = "kittens";
let n = parseInt(x);
if (isNaN(n)) {
    console.log(x   " is not a number");
}

Важной частью этого примера является преобразование чисел и выяснение, какую операцию выполнить.

 // get the elements in the DOM
let numberOne = document.getElementById("numberOne");
let numberTwo = document.getElementById("numberTwo");
let output = document.getElementById("output");
let calculator = document.getElementById("calculator");

// every time the calculator values change
calculator.addEventListener('change', function(evt) {

  // get the values from the number inputs and try to convert them to floating point
  let valueOne = parseFloat(numberOne.value);
  let valueTwo = parseFloat(numberTwo.value);

  // if both numbers are numbers (this is not 100% accurate)
  if (!isNaN(valueOne) amp;amp; !isNaN(valueTwo)) {
  
    // create a variable to store the result
    let value = 0;
    
    // get the radio buttons
    let ops = calculator['operation'];
    
    // use the selected radio button to determine the operation
    switch (ops.value) {
      case ' ':
        value = valueOne   valueTwo;
        break;
      case '-':
        value = valueOne - valueTwo;
    }
    
    // display the result
    output.textContent = value;
  }
});

 <form id="calculator">
  <!-- first number -->
  <input id="numberOne" type="number" placeholder="1.0" step="0.01" min="0" max="10">
  <br>
  <!-- radio buttons for operations -->
  <label for="add">Add
<input type="radio" name="operation" value=" ">
</label>
  <label for="subtract">Subtract
<input type="radio" name="operation" value="-">
</label>
  <br>
  <!-- second number -->
  <input id="numberTwo" type="number" placeholder="1.0" step="0.01" min="0" max="10">
</form>

<!-- to display the result -->
<output id="output"></output>

Развернуть фрагмент