首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >HTML/Javascript货币转换器

HTML/Javascript货币转换器
EN

Stack Overflow用户
提问于 2013-11-05 02:20:02
回答 3查看 63.6K关注 0票数 3

我正在尝试制作一个货币转换器,可以在几种不同的货币之间进行转换。它使用一些预先确定的汇率。将显示输入框,但所有javascript似乎都不起作用。有什么帮助吗?

使用更新的代码进行编辑。仍然不转换任何内容。

HTML正文:

代码语言:javascript
复制
<body onload="init()">

    <input type="text" id="GBP" size="10" value="0" onchange="gbp()"/>
    <label for="GBP"> GBP </label>

    </br>

    <input type="text" id="USD" size="10" value="0" onchange="usd()" />
    <label for="USD"> USD </label>

    </br>

    <input type="text" id="EUR" size="10" value="0" onchange="eur()" />
    <label for="EUR"> EUR </label>

    </br>

    <input type="text" id="CAD" size="10" value="0" onchange="cad()" />
    <label for="CAD"> CAD </label>

    </br>

    <input type="text" id="AUD" size="10" value="0" onchange="aud()" />
    <label for="AUD"> AUD </label>



</body>

Javascript代码:

代码语言:javascript
复制
var gbp, usd, eur, cad, aud;
function init()
{
    gbp = document.getElementById("GBP");
    usd = document.getElementById("USD");
    eur = document.getElementById("EUR");
    cad = document.getElementById("CAD");
    aud = document.getElementById("AUD");
}

function gbp()
{
    usd.value = parseFloat(gbp.value) * 0.49246;
    eur.value = parseFloat(gbp.value) * 0.69714;
    cad.value = parseFloat(gbp.value) * 0.50221;
    aud.value = parseFloat(gbp.value) * 0.43497;
}

function eur()
{
    gbp.value = parseFloat(eur.value) * 1.43448;
    usd.value = parseFloat(eur.value) * 0.70641;
    cad.value = parseFloat(eur.value) * 0.72037;
    aud.value = parseFloat(eur.value) * 0.62382;
}

function cad()
{
    gbp.value = parseFloat(cad.value) * 1.99169;
    usd.value = parseFloat(cad.value) * 0.98054;
    eur.value = parseFloat(cad.value) * 1.38814;
    aud.value = parseFloat(cad.value) * 0.86613;
}

function aud()
{
    gbp.value = parseFloat(aud.value) * 2.29964;
    usd.value = parseFloat(aud.value) * 1.13262;
    eur.value = parseFloat(aud.value) * 1.60329;
    cad.value = parseFloat(aud.value) * 0.88297;    
}

function usd()
{
    gbp.value = parseFloat(usd.value) * 2.03032;
    eur.value = parseFloat(usd.value) * 1.41544;
    cad.value = parseFloat(usd.value) * 1.01941;
    aud.value = parseFloat(usd.value) * 0.88297;
}
EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2013-11-05 02:21:49

您需要从initialize函数中删除var语句,并将其添加到此函数之上:

代码语言:javascript
复制
var gbp, usd, eur, cad, aud;
function init()
{

    gbp = document.getElementById("GBP");
    usd = document.getElementById("USD");
    eur = document.getElementById("EUR");
    cad = document.getElementById("CAD");
    aud = document.getElementById("AUD");
    //...

在这种情况下,变量gbp, usd, eur, cad, aud将在其他函数作用域中可见。

也许你需要阅读更多关于变量和作用域的知识。例如在MDN。作用域和闭包在JS中非常重要。

票数 3
EN

Stack Overflow用户

发布于 2015-02-12 05:22:42

我知道这是旧的,但我只是偶然发现它,我想你可能想知道为什么你的代码仍然不能工作,即使在antyrat的(正确的)建议之后。

问题出在您的变量和函数名称之间的冲突。

有一些很好的文章解释了当您在场外执行此操作时实际发生的情况,such as here

简单的修复方法:更改函数名...

代码语言:javascript
复制
var gbp, usd, eur, cad, aud;
function init()
{
    gbp = document.getElementById("GBP");
    usd = document.getElementById("USD");
    eur = document.getElementById("EUR");
    cad = document.getElementById("CAD");
    aud = document.getElementById("AUD");
}

function gbpfunc()
{
    usd.value = parseFloat(gbp.value) * 0.49246;
    eur.value = parseFloat(gbp.value) * 0.69714;
    cad.value = parseFloat(gbp.value) * 0.50221;
    aud.value = parseFloat(gbp.value) * 0.43497;
}

function eurfunc()
{
    gbp.value = parseFloat(eur.value) * 1.43448;
    usd.value = parseFloat(eur.value) * 0.70641;
    cad.value = parseFloat(eur.value) * 0.72037;
    aud.value = parseFloat(eur.value) * 0.62382;
}

function cadfunc()
{
    gbp.value = parseFloat(cad.value) * 1.99169;
    usd.value = parseFloat(cad.value) * 0.98054;
    eur.value = parseFloat(cad.value) * 1.38814;
    aud.value = parseFloat(cad.value) * 0.86613;
}

function audfunc()
{
    gbp.value = parseFloat(aud.value) * 2.29964;
    usd.value = parseFloat(aud.value) * 1.13262;
    eur.value = parseFloat(aud.value) * 1.60329;
    cad.value = parseFloat(aud.value) * 0.88297;    
}

function usdfunc()
{
    gbp.value = parseFloat(usd.value) * 2.03032;
    eur.value = parseFloat(usd.value) * 1.41544;
    cad.value = parseFloat(usd.value) * 1.01941;
    aud.value = parseFloat(usd.value) * 0.88297;
}

init();
代码语言:javascript
复制
<input type="text" id="GBP" size="10" value="0" onchange="gbpfunc()"/>
    <label for="GBP"> GBP </label>

    </br>

    <input type="text" id="USD" size="10" value="0" onchange="usdfunc()" />
    <label for="USD"> USD </label>

    </br>

    <input type="text" id="EUR" size="10" value="0" onchange="eurfunc()" />
    <label for="EUR"> EUR </label>

    </br>

    <input type="text" id="CAD" size="10" value="0" onchange="cadfunc()" />
    <label for="CAD"> CAD </label>

    </br>

    <input type="text" id="AUD" size="10" value="0" onchange="audfunc()" />
    <label for="AUD"> AUD </label>  

票数 6
EN

Stack Overflow用户

发布于 2021-03-09 22:01:37

我们可以委托并尽量保持DRY原则

代码语言:javascript
复制
const conv = { "gbp": { usd: 1.39, eur: 1.17, cad: 1.75, aud: 1.80 }, "eur": { gbp: 0.86, usd: 1.19, cad: 1.50, aud: 1.54 }, "cad": { gbp: 0.57, usd: 0.79, eur: 0.67, aud: 1.03 }, "aud": { gbp: 0.55, usd: 0.97, eur: 0.65, cad: 0.97 }, "usd": { gbp: 0.72, eur: 0.84, cad: 1.26, aud: 1.30 } };

const formatVal = num =>  {
  const dec = num % 1 ? 2 : 0; // https://twitter.com/wesbos/status/1369713969007575043
  return (num).toFixed(dec);
};
window.addEventListener("load", function() {
  const fs = document.getElementById("fs");
  const fields = [...fs.querySelectorAll("input")].reduce((acc, fld) => (acc[fld.id.toLowerCase()] = fld, acc), {})
  fs.addEventListener("input", function(e) {
    const tgt = e.target;
    const from = tgt.id.toLowerCase();
    let fromVal = +tgt.value;
    Object.entries(conv[from]).forEach(([key, val]) => fields[key].value = formatVal(val * fromVal));
  });
});
代码语言:javascript
复制
fieldset {
  width: 150px;
}

input[type=number] {
  text-align: right;
  width:80px;
}
代码语言:javascript
复制
<fieldset id="fs">
  <label><input type="number" id="GBP" value="0" autocomplete="off" /> GBP</label></br>
  <label><input type="number" id="USD" value="0" autocomplete="off" /> USD</label></br>
  <label><input type="number" id="EUR" value="0" autocomplete="off" /> EUR</label></br>
  <label><input type="number" id="CAD" value="0" autocomplete="off" /> CAD</label></br>
  <label><input type="number" id="AUD" value="0" autocomplete="off" /> AUD</label>
</fieldset>

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/19774387

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档