0

This is going to be a long one. I have an assignment I have been working on and I have been having issues. I have a ton of code and I am not quite sure how to get it to function properly if at all with what I am trying to do. I will post the sections and maybe some of you can see that I am trying to keep this in JavaScript only and not jQuery or pHp or anything else, keep seeing that as responses.

First part: html code

<!DOCTYPE html>
<html lang="en">

<head>
<title>Currency Converter 2.0</title>
<meta charset="utf-8">
<link rel="stylesheet" href="currency.css">
<script src="currency1.js">
</script>
</head>

<body>
<h1>Currency Converter</h1>
<p>Enter Dollar Amount</p>
<form>
  <input type="text" id="currencyTextInput" size="40" placeholder="For example 12.12">
  <input type="submit" id="addButton" value="Enter">
</form>
<ul>
  <li id="money0"></li>//these names are not final,
  <li id="money1"></li>//I know i will need to change them
  <li id="money2"></li>
  <li id="money3"></li>
  <li id="money4"></li>
</ul>
</body>
</html>

second part: .js file

window.onload = function () {
var button = document.getElementById("addButton");
button.onclick = handleButtonClick;
}

var exchangeRate = []; 
//this will be later one in the code, but aiming to have data pushed in here from objects

function handleButtonClick(e) {
var textInput = document.getElementById("currencyTextInput");
var moneyString = textInput.value;
var parsedMoney = parseFloat(moneyString);
var valid = !isNaN(parsedMoney);

if (!valid) {
        alert("Please, enter a valid number");
} else {
    //planning on using this part to list my results in a bullet list   
}
e.preventDefault();
}

So with testing that part works with my html code, minus the else. the rest of my code with my methods. this is where I am having issues. I can do one method and have it work, but I have 5 that I am to get the info from.

function GetCurrency(name, cRate) {
this.name = name;
this.c_rate = c_rate;
this.convert = function(usd) {
   cRate * currencyTextInput  //not sure if this will grab that info or not
return //haven't the slightest idea where to send this data
}
}

var e_u = {
name: "European Euro",
cRate: 0.77334,
convert: function() {
   cRate * currencyTextInput
return exchangeRate.push(exchangeRate())//not sure if this is possible or do I need
}                                       //to assign an array slot for it
};

var u_k = {
name: "British Pound Sterling",
cRate: 0.66202,
convert: function() {
   cRate * currencyTextInput
return exchangeRate.push(exchangeRate())
}
};

var india = {
name: "Indian Rupee",
cRate: 55.7155,
convert: function() {
   cRate * currencyTextInput
return exchangeRate.push(exchangeRate())
}
};

var aus = {
name: "Australian Dollar",
cRate: 1.02931,
convert: function() {
   cRate * currencyTextInput
return exchangeRate.push(exchangeRate())
}
};

var japan = {
name: "Japanese Yen",
cRate: 102.063,
convert: function() {
   cRate * currencyTextInput
return exchangeRate.push(exchangeRate())
}
};

Basically, trying to have the user enter a number, validate that, then display that number (which will be usd) and multiply by each conversion rate and then display the results and the country/currency associated with the result in an ordered bullet list. Hopefully that is possible with what I have or is possible to do. I am just not sure how to push method data to an array and I need 2 bits of info from each. This is so aggravating, beginning web programming class my ass.

4

1 回答 1

0

由于这是一项任务,我只会为您指明正确的方向。

首先将所有货币数据合并到一个数组中,然后您可以更轻松地处理它,此外添加新货币应该要求您将其添加到此表中,仅此而已!:

  var currencies = [
    {name: "Australian Dollar", rate: 1.02931 },
    {name: "Indian Rupee", rate: 55.1755 }
   // ... etc
  ];

现在添加一个事件处理程序以在美元金额更改或单击转换按钮时触发。在该处理程序中创建一个具有相应货币值的新数组:

  var conversions = currencies.map (function (c) {
    return '<li>' + c.name + ' : ' + c.rate * dollarValue + '</li>';
  });

dollarValue当然,是您从用户输入中获得的价值。确保它是一个数字。而不是map您可以使用for循环来处理货币数组。请注意,我已将每个转换都包装在<li> </li>准备插入 HTML 中

使用上面计算的结果查找ul您的结果document.getElementById并将其内容替换:

  document.getElementById ('results').innerHTML = conversions.join ('');

在您的 HTML 中,<ul>最初将为空。

而已。总共不应超过 20 行 JS。

如果您遇到困难,请使用您的新代码发布一个新问题以及为什么它不起作用。在此处添加评论,以便我收到您的新问题的提醒。

于 2013-06-03T06:43:29.680 回答