Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 21.10.2014, 10:40
Аспирант
Отправить личное сообщение для alexmixaylov Посмотреть профиль Найти все сообщения от alexmixaylov
 
Регистрация: 14.09.2013
Сообщений: 70

Преключатель валют
Пишу переключатель валют для сайта
Впал в ступор - дальше не пойму как делать, подскажите пож что использовать
есть несколько блоков с ценой
<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)

Знаю, что нужно как то в цикл обернуть , но не пойму Что совать туда, чтобы по клику все цены переписывались
Ответить с цитированием
  #2 (permalink)  
Старый 21.10.2014, 10:55
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 12,327

Сообщение от alexmixaylov
ужно чтобы при клике на выбраную валюту (span.jsCur) пересчитывались все цены на страничке(p.price)
Тогда непонятно почему так много "блоков" с выбором валюты...

Да и цифра у тебя только одна - типа итоговая...
По-мне так удобнее где-то хранить "базовую" цену (например в рублях), а итоговую вычислять "от базовой" и показывать.
Ответить с цитированием
  #3 (permalink)  
Старый 21.10.2014, 11:05
Аспирант
Отправить личное сообщение для alexmixaylov Посмотреть профиль Найти все сообщения от alexmixaylov
 
Регистрация: 14.09.2013
Сообщений: 70

Сообщение от ksa Посмотреть сообщение
Тогда непонятно почему так много "блоков" с выбором валюты...
Нет традиционного переключателя, это не магазин
человек захотел, чтобы около каждой цены была валюта
Сообщение от ksa Посмотреть сообщение
По-мне так удобнее где-то хранить "базовую" цену (например в рублях), а итоговую вычислять "от базовой" и показывать.
Так и есть - рублевая цена базовая basePrice - она берется из p.price
ее нужно помножить на rate и получиться цена в нужной валюте
Ответить с цитированием
  #4 (permalink)  
Старый 21.10.2014, 11:19
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 26,332

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>

Последний раз редактировалось рони, 21.10.2014 в 11:26.
Ответить с цитированием
  #5 (permalink)  
Старый 21.10.2014, 11:53
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 12,327

Сообщение от alexmixaylov
человек захотел, чтобы около каждой цены была валюта
Тогда зачем менять все цифры? Менять, в таком случае, нужно там, где изменили валюту...

Сообщение от alexmixaylov
Так и есть - рублевая цена базовая basePrice - она берется из p.price
ее нужно помножить на rate и получиться цена в нужной валюте
По-мне так фиговый подход...
Ответить с цитированием
  #6 (permalink)  
Старый 21.10.2014, 11:59
Аспирант
Отправить личное сообщение для alexmixaylov Посмотреть профиль Найти все сообщения от alexmixaylov
 
Регистрация: 14.09.2013
Сообщений: 70

рони, Это реально круто
здесь нужно делить на курс получается а не отнимать, или переписать курсы
хочу округлить значение, дописываю в цикл .data('price') / rates[cur]).Math.round()
округляет норм, но выдает ошибку в отладчике
Ответить с цитированием
  #7 (permalink)  
Старый 21.10.2014, 12:02
Аспирант
Отправить личное сообщение для alexmixaylov Посмотреть профиль Найти все сообщения от alexmixaylov
 
Регистрация: 14.09.2013
Сообщений: 70

Сообщение от ksa Посмотреть сообщение
Тогда зачем менять все цифры? Менять, в таком случае, нужно там, где изменили валюту...
Смотрел ролик про Берию и Сталина?
"Хочу иконки на рабочем столе....
Несмотря на советскую власть"
Это из той оперы примерно
Ответить с цитированием
  #8 (permalink)  
Старый 21.10.2014, 12:10
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 26,332

Сообщение от alexmixaylov
.data('price') / rates[cur]).Math.round()

$(this).text(Math.round($(this).data('price') / rates[cur]))
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Конвертер валют с привязкой к гривне animhotep Ваши сайты и скрипты 0 03.08.2014 13:18
Обновление цены в прайсе по курсу валют Olger Общие вопросы Javascript 4 28.02.2014 18:05
Проблема с выводом курса валют bubanay Элементы интерфейса 0 20.12.2013 18:42
Как брать курс валют с другого сайта? vasim Общие вопросы Javascript 6 24.10.2008 10:53