javascript - JS - 根据选定的下拉菜单计算值

Question

所以我有这个货币计算器，可以显示您输入的金额，但显示的是不同的货币值(value)。 (例如美元兑欧元)

这是 HTML:

    <b> Exchange money </b> <br> <br>
Enter amount for RSD: <input type="number" name="nbsAmount" id="nbsAmount" size="5"> <br>
<button class="dugme">Calculate</button> <br> <br>
Evro value is: <div class="konacnaEvroVrednost"></div>
Dolar value is: <div class="konacnaDolarVrednost"></div>
Swiss value is: <div class="konacnaSwissrednost"></div>

这是 JS:

$('.dugme').click(function(){
   var broj = document.getElementById('nbsAmount').value;   
   var evro = broj * 0.0085;
   var dolar = broj * 0.0095;
   var frank = broj * 0.0096;
   $('.konacnaEvroVrednost').text(evro + ' €');  
   $('.konacnaDolarVrednost').text(dolar + ' $');  
   $('.konacnaSwissrednost').text(frank + ' Fr');  
});

这很好用。如您所见:

这是 fiddle : http://jsfiddle.net/5zvdwtpL/1/

但现在我想将其更改为更加动态地工作。 我希望有两个下拉列表，让您选择要更改的值。像这样:

这是我目前得到的:https://jsfiddle.net/7s8g9kLt/2/

问题是一个输入值应该被复制到另一个输入值，但带有货币的附加值。

所以如果我选择 RSD 并设置 1200，另一个 USD，那么另一个输入应该显示 11.4。

所以我对如何实现这一点有点困惑。

Answer 1

首先，您已将 myFunction 绑定(bind)到按钮的 onClick 事件，但您尚未使用此名称定义函数。单击按钮后，您可以在控制台中看到以下错误

Uncaught ReferenceError: myFunction is not defined

你必须定义这个函数:

window.myFunction = function() {...}

或者事件更好，为按钮点击添加事件监听器:

document.getElementById('buttonId').addEventListener('click', function() {...})

---

要计算动态汇率，我会先将输入金额转换为单一货币(例如 RSD)，然后将该值乘以正确的汇率。

我修改了您的 jsFiddle ( https://jsfiddle.net/rhj4dgz7/3/) 以反射(reflect)这些更改。