Javascript: простой конвертер валют с предыдущими преобразованиями

то, что я собираюсь сделать, это очень простой конвертер валют. По сути, вы вводите число и нажимаете кнопку, отображается текст, который гласит: «x долларов — это y евро». Нажимаем кнопку еще раз, новый текст отображается там, где был старый, а старый отображается под новым.

Я дошел до того, что при вводе чего-либо в поле оно всплывает внизу, а если нажать кнопку еще раз (с тем же или другим значением), то оно становится списком текста.

Чтобы прояснить, что я здесь говорю, взгляните на этот jsfiddle: http://jsfiddle.net/w8KAS/5/

Теперь я хочу сделать так, чтобы работали только числа, и чтобы число (x) преобразовывалось при нажатии кнопки и отображалось ниже рядом с подходящим текстом (например, «x долларов - это y евро»)

Это мой код js, проверьте полный код jsfiddle (html, js, css)

Какие-либо предложения?

var count = 0;

function validate() {

   var amount = document.querySelector("#amount");

   if(amount.value.length > 0) {
       amount.className = 'correct';
   }

   else {
    amount.className = 'empty';
   }

   if (document.querySelector('.empty')) {
    alert('Något är fel');
   }

   else {
   addconvert(amount.value);
   }    
}

function addconvert(amount) {

   var table = document.querySelector('#tbody');
   var tr = document.createElement('tr');
   var amountTd = document.createElement('td');


   var amountTextNode = document.createTextNode(amount);

   amountTd.appendChild(amountTextNode)
   tr.appendChild(amountTd);

   table.insertBefore(tr, table.firstChild);

   count++;     
}



var button = document.querySelector(".button");

button.onclick = validate;

javascript currency converter
person Andrew P    schedule 09.01.2014    source источник
comment
Итак, вы спрашиваете, как проверить, является ли строка допустимым числом?   -  person Pointy    schedule 09.01.2014
comment
Вы только хотите конвертировать доллары в евро? можете ли вы привести статический пример того, как вы хотите, чтобы результат выглядел   -  person gaurav5430    schedule 09.01.2014
comment
да, я только хочу конвертировать доллары в евро, очень просто   -  person Andrew P    schedule 09.01.2014

Ответы (3)


arrow_upward
2
arrow_downward

Проверка вашего номера не проходит. Измените первую часть вашей проверки на это:

 function validate() {

    var amount = document.querySelector("#amount");
    var amountNum = parseFloat(amount.value);  //This is the numeric value, use it for calculations

    if(amount.value.length > 0 && !isNaN(amountNum) ) {
        amount.className = 'correct';
        amount.value = amountNum;
    }
    ...

Работает здесь: http://jsfiddle.net/edgarinvillegas/w8KAS/6/

Ваше здоровье

person Edgar Villegas Alvarado    schedule 09.01.2014
comment
isNaN = не является числом. Разве то, что вы только что написали, не говорило бы что-то вроде этого: если длина суммы больше 0 и не является числом, запустите это (:amount.className и т. д.). Я хочу, чтобы это было числом. Также спасибо за ответ - person Andrew P; 09.01.2014
comment
Вот почему перед isNaN стоит !, поэтому !isNaN = число (двойное логическое отрицание) - person Edgar Villegas Alvarado; 10.01.2014
comment
О да, извините, у меня это получилось благодаря вам, так что большое спасибо! - person Andrew P; 10.01.2014
comment
Добро пожаловать :). Советую изучить jQuery, с jQuery все это так просто ;) - person Edgar Villegas Alvarado; 10.01.2014

arrow_upward
1
arrow_downward

Вам нужен коэффициент конверсии (для этого есть API), а затем вы можете просто добавить их вместе в строку

var convRate = 1.3; 
var amountTextNode = document.createTextNode(amount + " dollars is " + amount*convRate + " euros");

Что касается API, Yahoo скажет вам, что вам нужно, даже без необходимости входа в систему.

$.ajax({
  url: "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20yahoo.finance.xchange%20where%20pair%20in%20(%22USDEUR%22)&format=json&diagnostics=true&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback="
}).done(function(data) { 
  convRate = data.query.results.rate.Rate
});
person tdmartin    schedule 09.01.2014

arrow_upward
0
arrow_downward

Чтобы убедиться, что работают только числа, вы можете протестировать переменную amount.value с помощью функции isNaN. Это вернет true, если пользовательский ввод не является числом, поэтому, если он вернет false, вы можете продолжить преобразование.

if (!isNaN(amount.value)){
  addconvert(+amount.value)  // the plus symbol converts to a number
} else {
  // display error here
}

Внутри вашей функции addconvert вы можете добавить код, который будет умножать введенную вами сумму на обменный курс, чтобы получить приблизительное преобразование.

function addconvert(){
  // ...

  var euros = 0.74 * amount
  var text = amount + ' dollars is ' + euros + ' euros'
  var amountTextNode = document.createTextNode(text);
person Dan Fox    schedule 09.01.2014