Как правильно использовать значения из текстовых полей в HTML, пожалуйста, помогите мне

Question

Я хотел использовать значения из текстовых полей, но не смог, поэтому я попытался с постоянными значениями, и теперь я получаю ошибку NAN.Я показываю свой результат на этикетке между прочим.

function myFunction() {
  var translength = 2400
  var transSpacing = 150
  var transEndOverhang = 75
  var transStartOverhang = 75

  var longLength = 6000
  var LongSpacing = 150
  var LongStartOverhang = 75
  var LongEndOverhang = 75

  if (transSpacing != 0)
    document.getElementById('longAmount').value = ((transLength - transStartOverhang - transEndOverhang) / transSpacing) + 1;
  document.getElementById('longAmount').innerHTML = document.getElementById('longAmount').value
  if (document.getElementById('longAmount').value > 0 && transStartOverhang + ((document.getElementById('longAmount').value - 1) * transSpacing) + transEndOverhang < transLength)
    document.getElementById('longAmount').value = longAmount + 1;
  document.getElementById('longAmount').innerHTML = document.getElementById('longAmount').value
}

Answer 1

Вы смешиваете innerHTML и value для одного и того же идентификатора.Если этот идентификатор является текстовым полем, вы должны использовать .value.Также для преобразования строк (текста из текстовой области) вы можете использовать parseInt() или parseFloat().

// Here you're taking a bunch of variables and sets the textareas value
document.getElementById('longAmount').value = ((transLength - transStartOverhang - transEndOverhang) / transSpacing) + 1;

// Makes no sense (textarea doesn't have a innerHTML)
document.getElementById('longAmount').innerHTML = document.getElementById('longAmount').value;

// document.getElementById('longAmount').value is a string here
if (document.getElementById('longAmount').value > 0 && transStartOverhang + ((document.getElementById('longAmount').value - 1) * transSpacing) + transEndOverhang < transLength)
    document.getElementById('longAmount').value = longAmount + 1; // longAmount is undefined.

// Again, makes no sense.
document.getElementById('longAmount').innerHTML = document.getElementById('longAmount').value;