Преключатель валют
Пишу переключатель валют для сайта
Впал в ступор :) - дальше не пойму как делать, подскажите пож что использовать есть несколько блоков с ценой
<div class="wrap-price">
<p class="price">1690</p>
<p class="curency">
<span class="jsCur usd">USD</span>
<span class="jsCur eur">EUR</span>
<span class="jsCur rub">RUB</span>
</p>
</div>
<div class="wrap-price">
<p class="price">990</p>
<p class="curency">
<span class="jsCur usd">USD</span>
<span class="jsCur eur">EUR</span>
<span class="jsCur rub">RUB</span>
</p>
</div>
$(document).ready(function () {
rate = 1;
//курсы валют
var rubRates = 1;
var usdRates = 40;
var eurRates = 50;
$('span.jsCur.usd').addClass('active'); //ставлю валюту по умолчанию
var basePrice = parseInt($('p.price').html()); //получаю базовую цену в блоке
var activePrice = $('span.active').html(); //вычисляю какая валюта выбрана
function calcRate() { //функция расчета множителя
if (activePrice == 'USD') {
rate = rubRates / usdRates;
}
if (activePrice == 'EUR') {
rate = rubRates / eurRates;
}
//console.log(rate);
}
calcRate();
//смена валюты по клику
$("span.jsCur").click(function changeCur() {
if ($(this).hasClass("usd")) {
$("span.jsCur").removeClass("active");
$('span.jsCur.usd').addClass("active");
}
if ($(this).hasClass("rub")) {
$("span.jsCur").removeClass("active");
$('span.jsCur.rub').addClass("active");
}
if ($(this).hasClass("eur")) {
$("span.jsCur").removeClass("active");
$('span.jsCur.eur').addClass("active");
}
});
var wrapPrice = {
price: basePrice,
curPrice: basePrice * rate
};
console.log(wrapPrice.curPrice);
console.log(rate);
});
нужно чтобы при клике на выбраную валюту (span.jsCur) пересчитывались все цены на страничке(p.price)Знаю, что нужно как то в цикл обернуть , но не пойму Что совать туда, чтобы по клику все цены переписывались |
Цитата:
Да и цифра у тебя только одна - типа итоговая... По-мне так удобнее где-то хранить "базовую" цену (например в рублях), а итоговую вычислять "от базовой" и показывать. |
Цитата:
человек захотел, чтобы около каждой цены была валюта Цитата:
ее нужно помножить на rate и получиться цена в нужной валюте |
alexmixaylov,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.active {
background: #FFCC00;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function() {
var rates = {
rub: 1,
usd: 40,
eur: 45
};
//смена валюты по клику
var $span = $("span.jsCur"),
$price = $('.price');
$span.click(function() {
$span.removeClass("active");
var cur = $(this).data("cur");
$span.filter('[data-cur="' + cur + '"]').addClass("active")
$price.each(function(indx, element) {
!$(this).data('price') && $(this).data('price', +$(this).text());
$(this).text($(this).data('price') * rates[cur])
});
}).first().click();
}); </script>
</head>
<body>
<div class="wrap-price">
<p class="price">1690</p>
<p class="curency">
<span class="jsCur usd" data-cur="usd">USD</span>
<span class="jsCur eur" data-cur="eur">EUR</span>
<span class="jsCur rub" data-cur="rub">RUB</span>
</p>
</div>
<div class="wrap-price">
<p class="price">990</p>
<p class="curency">
<span class="jsCur usd" data-cur="usd">USD</span>
<span class="jsCur eur" data-cur="eur">EUR</span>
<span class="jsCur rub" data-cur="rub">RUB</span>
</p>
</div>
</body>
</html>
|
Цитата:
Цитата:
|
рони, Это реально круто :)
здесь нужно делить на курс получается а не отнимать, или переписать курсы хочу округлить значение, дописываю в цикл .data('price') / rates[cur]).Math.round() округляет норм, но выдает ошибку в отладчике |
Цитата:
"Хочу иконки на рабочем столе.... Несмотря на советскую власть" Это из той оперы примерно :) |
Цитата:
$(this).text(Math.round($(this).data('price') / rates[cur]))
|
| Часовой пояс GMT +3, время: 08:48. |