Пересчет значений на JS?

Question

[Cyril Diamandi]

Приветствую.

Есть HTML документ. Условно, в нём содержатся следующие данные:

<span class="price">100 USD</span>
<span class="price">200 USD</span>
<span class="price">300 USD</span>

Возникла необходимость организовать пересчёт цен по отношению к другим валютам, при этом есть одна основная валюта, от которой всё и отталкивается. Т.е. на странице 1 должна быть одно значение (одна валюта), на странице 2 - другое с использованием одного и того же скрипта. Пересчитываться должны все значения на странице. На одной странице разных значений быть не может.

Прошу подсказать, как грамотно сделать это на клиенте (без SQL и иже с ними) и в какую сторону копать. Насколько я понимаю, проще всего это будет сделать с помощью чего-то вроде:

<span class="price" data-value="usd">100 USD</span>
<span class="price" data-value="eur">95 EUR</span>

Не совсем понимаю, как правильно это сделать с учетом того, что значения часто меняются, т.е. нужен наиболее удобный вариант для их постоянного изменения (вручную, тянуть неоткуда).

Спасибо заранее!

Answer 1

[Immortal_pony]

1. Записываете значение в эталонной валюте в data-атрибут.
2. При переключении на другую валюту высчитывает коэффициент умножения.
3. Ввыводите пересчитанное значение.

Примерно так:

<span class="price" data-default-currency-value="100">100 USD</span>
<span class="price" data-default-currency-value="500">500 USD</span>
<button class="recalculate" data-currency="EUR">Recalculate in EUR</button>
<button class="recalculate" data-currency="RUB">Recalculate in RUB</button>

var currencyCoefficients = {
    EUR: 1.1,
    RUB: 65
};


$('.recalculate').on('click', function() {     
    var currency = $(this).data('currency');
    
    $('.price').each(function() { 
        var value = $(this).data('default-currency-value');
        var recalculatedValue = Math.ceil(value*currencyCoefficients[currency]);
        
        $(this).html(recalculatedValue + ' ' + currency);
    });
});

Пример: jsfiddle.net/2tpsshu3

Comments

[Cyril Diamandi]

То что нужно, большое спасибо!

Answer 2

[lega]

Пример - тоже самое что и у Immortal_pony, только попроще.

Answer 3

[Mikhail Osher]

openexchangerates.github.io/money.js

Answer 4

[Дмитрий Гусев]

Я бы сделал так:
с бекенда передавал бы текущий курс валют по отношению к основной вида:

rates = {
usd:100,
eur:100
rub: 100
uah:100
}

а дальше скриптом проходился бы по элементам
.price[data-value]
и по курсу считал бы итоговую стоимость

Курс валют можно брать по АПИ почти любого банка

Comments

[Cyril Diamandi]

К сожалению, курс живёт своей жизнью и не равняется ни одному курсу валют в банках/обменниках. Вариант с бекендом не подходит, т.к. там SQL-ная база, нужно решение без запросов к ней.

[Aves]

Cyril Diamandi: ну откуда-то он же берётся? а считать примерно так