0

これは長いものになるでしょう。取り組んでいる課題があり、問題が発生しています。私は大量のコードを持っていますが、私がやろうとしていることで、それを適切に機能させる方法がよくわかりません。セクションを投稿しますが、jQuery や pHp などではなく、JavaScript のみでこれを維持しようとしていることがわかる人もいるかもしれません。それを応答として見続けてください。

最初の部分: html コード

<!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>

2 番目の部分: .js ファイル

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();
}

したがって、その部分をテストすると、else を除いた私の html コードで動作します。コードの残りの部分とメソッド。これは私が問題を抱えているところです。1 つの方法を実行して機能させることができますが、情報を取得する方法が 5 つあります。

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())
}
};

基本的には、ユーザーに数値を入力させ、それを検証してから、その数値 (米ドルになります) を表示し、各コンバージョン率を掛けてから、結果と、結果に関連付けられた国/通貨を順序付きの箇条書きリストに表示しようとします。うまくいけば、それは私が持っている、またはできることで可能です。メソッド データを配列にプッシュする方法がわかりません。それぞれから 2 ビットの情報が必要です。これはとても腹立たしいことです。Web プログラミングの授業を始めるのは私のお尻です。

4

1 に答える 1

0

これは課題なので、正しい方向だけを示します。

まず、すべての通貨データを 1 つの配列に結合すると、処理がはるかに簡単になります。さらに、新しい通貨を追加するには、このテーブルに追加するだけで済みます。:

  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できます。HTMLに挿入できるようforに、各変換をラップしたことに注意してください<li> </li>

ulを使用して結果の を検索し、document.getElementByIdその内容を上で計算した結果に置き換えます。

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

HTML では、<ul>最初は空になります。

それでおしまい。合計で 20 行程度の JS を超えないようにしてください。

行き詰まった場合は、新しいコードとそれが機能しない理由を記載した新しい質問を投稿してください。ここにコメントを追加して、あなたの新しい質問に注意してください。

于 2013-06-03T06:43:29.680 に答える