Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 22.06.2015, 18:06
Кандидат Javascript-наук
Отправить личное сообщение для ligisayan Посмотреть профиль Найти все сообщения от ligisayan
 
Регистрация: 19.06.2015
Сообщений: 114

Как преобразовать счетчик к нужному виду?
Всем привет. У меня есть счетчик, подсчитывающий количество и сумму конкретной продукции. В span с классом quantity хранится количество и сумма в виде "13 x 70 руб." input c type="number" должно получать значение quantity, т.е. цифру 13. input c type="button" увеличивают/уменьшают значение переменной input c type="number", что должно также отражаться в quantity, а сумма в amount перезаписываться в полном виде, т.е. сумма= 13*70 = 910 руб Сложность в преобразовании строк в значения и в автоматическом отслеживании изменений с обменом информации между селекторами. В коде написал смысл того, что хочу получить. Поможете в преобразовании?
<span class="quantity">13 × <span class="amount">70&nbsp;руб.</span></span>
<div class="quantity buttons_added">
  <input type="number" step="1" min="1" max="27" id="num_count" name="quantity" value="1" title="Кол." class="input-text qty text" size="4">
  <input type="button" value="+1" id="button_plus" class="plus">
  <input type="button" value="-1" id="button_minus" class="minus">
</div>

var quantity = $(".quantity").text();
$(".input-text.qty.text").val(quantity);
var amount = $(".amount").text();
var total = amount * quantity;
$(".quantity").text() = $(".input-text.qty.text").val(quantity);
$(".amount").text() = total;
Ответить с цитированием
  #2 (permalink)  
Старый 22.06.2015, 21:04
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

ligisayan,
может использовать data атрибут для хранения констант, а не текст?
Ответить с цитированием
  #3 (permalink)  
Старый 22.06.2015, 22:25
Кандидат Javascript-наук
Отправить личное сообщение для ligisayan Посмотреть профиль Найти все сообщения от ligisayan
 
Регистрация: 19.06.2015
Сообщений: 114

Сообщение от рони Посмотреть сообщение
ligisayan,
может использовать data атрибут для хранения констант, а не текст?
я бы вмешался в разметку, но она с помощью виджета выводится
Ответить с цитированием
  #4 (permalink)  
Старый 22.06.2015, 22:35
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

ligisayan,
а виджет инициализирует злой волшебник
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .amount {
    color: #FF0000;
  }

  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
  $(function() {
      var quantity = $(".quantity").text().match(/\d+/g),
          max = +$(".input-text.qty.text").attr("max"),
          min = +$(".input-text.qty.text").attr("min");

      function fn() {
          quantity[0] > max && (quantity[0] = max);
          quantity[0] < min && (quantity[0] = min);
          $(".input-text.qty.text").val(quantity[0]);
          $(".amount").text(quantity[1] + " " + (quantity[0] * quantity[1]) + "  руб");
          $(".quantity")[0].firstChild.data = quantity[0] + " × ";
      }
      $(".plus, .minus").click(function() {
          $(this).is(".plus") ? quantity[0]++ : quantity[0]--;
          fn()
      })
      $(".input-text.qty.text").click(function() {
          quantity[0] = this.value;
          fn()
      })
      fn()
  });
  </script>
</head>

<body>  <span class="quantity">13 × <span class="amount">70&nbsp;руб.</span></span>
<div class="quantity buttons_added">
  <input type="number" step="1" min="1" max="27" id="num_count" name="quantity" value="1" title="Кол." class="input-text qty text" size="4">
  <input type="button" value="+1" id="button_plus" class="plus">
  <input type="button" value="-1" id="button_minus" class="minus">
</div>


</body>

</html>
Ответить с цитированием
  #5 (permalink)  
Старый 23.06.2015, 11:51
Кандидат Javascript-наук
Отправить личное сообщение для ligisayan Посмотреть профиль Найти все сообщения от ligisayan
 
Регистрация: 19.06.2015
Сообщений: 114

Сообщение от рони Посмотреть сообщение
ligisayan,
а виджет инициализирует злой волшебник
рони, супер! только осталось еще разобрать 2 момента: если у меня цифры измеряются в тысячах и миллионах, то явно .match(/\d+/g)
недостаточно.
и второй момент у меня: если нажимаешь на "+" то прибавляет на 1, а если на "-" то сразу уменьшает на 3 единицы, а потом по одному и после, если вновь жмешь на "+" то сразу прибавляет на 3, а потом на 1. Это отчего так? у тебя в примере так не происходит..
Ответить с цитированием
  #6 (permalink)  
Старый 23.06.2015, 12:27
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

Сообщение от ligisayan
если у меня цифры измеряются в тысячах и миллионах, то явно .match(/\d+/g)
недостаточно.
почему?
Сообщение от ligisayan
то сразу прибавляет на 3,
а целом это жуткий костыль, придёт бабайка ругать будет, шаг влево шаг вправо растрел на месте вон у вас уже 3 выскочило
что у вас в коде мне неизвестно
Ответить с цитированием
  #7 (permalink)  
Старый 23.06.2015, 13:37
Кандидат Javascript-наук
Отправить личное сообщение для ligisayan Посмотреть профиль Найти все сообщения от ligisayan
 
Регистрация: 19.06.2015
Сообщений: 114

Сообщение от рони Посмотреть сообщение
почему?

а целом это жуткий костыль, придёт бабайка ругать будет, шаг влево шаг вправо растрел на месте вон у вас уже 3 выскочило
что у вас в коде мне неизвестно
ну, например сумму "360.000&nbsp;руб."
var quantity = $(".li .quantity").text().match(/\d+/g)
в консоли показало
["1", "360", "000"]
Ответить с цитированием
  #8 (permalink)  
Старый 23.06.2015, 13:42
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

ligisayan,
match(/\d+.?\d+?/g)
Ответить с цитированием
  #9 (permalink)  
Старый 23.06.2015, 13:58
Кандидат Javascript-наук
Отправить личное сообщение для ligisayan Посмотреть профиль Найти все сообщения от ligisayan
 
Регистрация: 19.06.2015
Сообщений: 114

Сообщение от рони Посмотреть сообщение
ligisayan,
match(/\d+.?\d+?/g)
рони не лучше
Ответить с цитированием
  #10 (permalink)  
Старый 23.06.2015, 14:13
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

ligisayan,
и что не так?
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Открытие div блока при первом визите на сайт Nushaba Общие вопросы Javascript 28 20.12.2013 21:24
Как преобразовать строку с тегами в DOM элимент GOll Общие вопросы Javascript 7 07.04.2010 10:39
Как текст из responseText преобразовать в теги? Бобр AJAX и COMET 24 26.02.2010 04:37
как преобразовать пароль на * pilot Общие вопросы Javascript 2 24.08.2009 17:50
Как правильно послать XML в POST запросе LowCoder AJAX и COMET 10 15.07.2009 23:20