Преобразование валют с использованием JAVASCRIPT. не могу установить значение преобразованного текстового поля ввода через мою функцию

Question

Я пытаюсь сделать конвертер валют, используя html и javascript (без jquery). Я пробовал много вещей, но я не могу установить значение текстового поля в конвертированную сумму. Что не так с моим кодом?

Так что я пытаюсь сделать, это в основном проверить, что валюта моя первоначальная сумма, основанная на том, что называют правильную функцию, чтобы сделать расчеты, а затем установить значение поля ввода с ид = «cur2» к результатам этих расчетов. Я попытался сделать это с следующим javascript кодом. Я только даю вам функции для евро к другим валютам (остальные работают аналогично):

window.onload = function() { 
 
    document.getElementById("btnConvert").addEventListener("click", convert); 
 
} 
 

 
function convert() { 
 
    var select = document.getElementById("currency1"); 
 
    var curr = select.options[select.selectedIndex].value; 
 
    var val = document.getElementById("cur2").value; 
 
    if (curr == "EUR") { 
 
     val = EURtoOther(); 
 
    } 
 
    if (curr == "USD") { 
 
     val = USDtoOther(); 
 
    } 
 
    if (curr == "GBP") { 
 
     val = GBPtoOther(); 
 
    } 
 
    if (curr == "AUD") { 
 
     val = AUDtoOther(); 
 
    } 
 
    if (curr == "JPY") { 
 
     val = JPYtoOther(); 
 
    } 
 
} 
 

 
function EURtoOther() { 
 
    var select = document.getElementById("currency2"); 
 
    var curr = select.options[select.selectedIndex].value; 
 
    var initval = document.getElementById("cur1").value; 
 
    if (curr == "EUR") { 
 
     return initval * 1.0; 
 
    } 
 
    if (curr == "USD") { 
 
     return initval * 1.13; 
 
    } 
 
    if (curr == "GBP") { 
 
     return initval * 0.79; 
 
    } 
 
    if (curr == "AUD") { 
 
     return initval * 1.55; 
 
    } 
 
    if (curr == "JPY") { 
 
     return initval * 123.27; 
 
    } 
 
}

<select id="currency1"> 
 
     <option value="EUR">Euro</option> 
 
     <option value="USD">US Dollar</option> 
 
     <option value="GBP">British Pound</option> 
 
     <option value="AUD">Australian Dollar</option> 
 
     <option value="JPY">Japanese Yen</option> 
 
    </select> 
 
    <input type="number" id="cur1"> 
 
    <button id="btnConvert">Convert</button> 
 
    <select id="currency2"> 
 
     <option value="EUR">Euro</option> 
 
     <option value="USD">US Dollar</option> 
 
     <option value="GBP">British Pound</option> 
 
     <option value="AUD">Australian Dollar</option> 
 
     <option value="JPY">Japanese Yen</option> 
 
    </select> 
 
    <input type="text" id="cur2">

не работает, и я не знаю, почему. Заранее спасибо.

Answer 1

Вы не устанавливая значение второго текстового поля. Используйте

document.getElementById("cur2").value = val; 

установить значение второго текстового поля

window.onload = function() { 
 
    document.getElementById("btnConvert").addEventListener("click", convert); 
 
} 
 

 
function convert() { 
 
    var select = document.getElementById("currency1"); 
 
    var curr = select.options[select.selectedIndex].value; 
 
    var val = document.getElementById("cur2").value; 
 
    if (curr == "EUR") { 
 
     val = EURtoOther(); 
 
    } 
 
    if (curr == "USD") { 
 
//  val = USDtoOther(); 
 
    } 
 
    if (curr == "GBP") { 
 
//  val = GBPtoOther(); 
 
    } 
 
    if (curr == "AUD") { 
 
//  val = AUDtoOther(); 
 
    } 
 
    if (curr == "JPY") { 
 
//  val = JPYtoOther(); 
 
    } 
 
    document.getElementById("cur2").value = val; 
 
} 
 

 
function EURtoOther() { 
 
    var select = document.getElementById("currency2"); 
 
    var curr = select.options[select.selectedIndex].value; 
 
    var initval = document.getElementById("cur1").value; 
 
    if (curr == "EUR") { 
 
     return initval * 1.0; 
 
    } 
 
    if (curr == "USD") { 
 
     return initval * 1.13; 
 
    } 
 
    if (curr == "GBP") { 
 
     return initval * 0.79; 
 
    } 
 
    if (curr == "AUD") { 
 
     return initval * 1.55; 
 
    } 
 
    if (curr == "JPY") { 
 
     return initval * 123.27; 
 
    } 
 
}

<select id="currency1"> 
 
     <option value="EUR">Euro</option> 
 
     <option value="USD">US Dollar</option> 
 
     <option value="GBP">British Pound</option> 
 
     <option value="AUD">Australian Dollar</option> 
 
     <option value="JPY">Japanese Yen</option> 
 
    </select> 
 
    <input type="number" id="cur1"> 
 
    <button id="btnConvert">Convert</button> 
 
    <select id="currency2"> 
 
     <option value="EUR">Euro</option> 
 
     <option value="USD">US Dollar</option> 
 
     <option value="GBP">British Pound</option> 
 
     <option value="AUD">Australian Dollar</option> 
 
     <option value="JPY">Japanese Yen</option> 
 
    </select> 
 
    <input type="text" id="cur2">

Answer 2

Вы должны сделать document.getElementById().value = val;. val не относится к этому элементу, это просто значение, поэтому вам нужно установить его после.

https://jsfiddle.net/stevenkaspar/aphxcpcs/