Как использовать оператор if для извлечения значения из тега select? (Javascript) - PullRequest
Новая
       76

Как использовать оператор if для извлечения значения из тега select? (Javascript)

0 голосов
/ 08 апреля 2020

Мое первое поле ввода 

<input type="number" id="number1">
<br>
<br>

Мои параметры 

<input type="number" id="number1">
<select id="operation">  
<option value="add">Add</option>
<option value="subtract">Subtract</option>
</select>
<br>
<br>

Мое второе поле ввода 

<input type="number" id="number2">
<br>
<br>

Это кнопка ниже 

<button onclick="calculateNum()">Calculate</button>
<br>
<p id="result">This is your result....</p>
</select>
<script>
function calculateNum(){
var operation = document.getElementById("operation").value;

В приведенном ниже коде (операторы if) есть ли какие-либо синтаксические ошибки? 

if(operation == "add"){
var num1 = document.getElementById("num1");
var num2 = document.getElementById("num2");
var result = parseInt(number1) + parseInt(number2);
document.getElementById("result").innerHTML = result;
}
else if(operation == "subtract"){
var num1 = document.getElementById("num1");
var num2 = document.getElementById("num2");
var result = parseInt(number1) - parseInt(number2);
document.getElementById("result").innerHTML = result;
}
}
</script>

Ответы [ 2 ]

1 голос
/ 08 апреля 2020

У вас много ошибок, таких как:

  • Вы определяете 2 входа с идентификаторами number1 и number2, но вы ссылаетесь на num1 и num2

  • Вы объявляете num1 и num2 переменные, но вы используете number1 и number2 при разборе.

  • Вы переопределяете простое текст в объекте результата.

Я редактировал ваш код. Теперь вы можете попробовать это как: 

function calculateNum() {
  var operation = document.getElementById("operation").value;
  
  var num1 = document.getElementById("number1").value;
  var num2 = document.getElementById("number2").value;
  
  var result;
  
  if(operation == "add"){
    result = parseInt(num1) + parseInt(num2);
  } else {
    result = parseInt(num1) - parseInt(num2);
  }
  
  document.getElementById("result").innerHTML = result;
  // or
  // document.getElementById("result").textContent = result;
  // document.getElementById("result").innerText = result;
}
<input type="number" id="number1">
<input type="number" id="number2">

<select id="operation">  
  <option value="add">Add</option>
  <option value="subtract">Subtract</option>
</select>

<button onclick="calculateNum()">Calculate</button>
<br>
<p>This is your result: <span id="result"></span></p>
0 голосов
/ 08 апреля 2020

Попробуйте получить индекс выбранного параметра и выбрать его среди параметров, например: 

let selectField = document.getElementById('operation');
let operation = selectField.options[selectField.selectedIndex].value;
if (operation == "add") {
    // do something
}
...