Форум

Лунтик · #1 (**permalink**) 17.06.2020, 08:48

У меня есть код и мне нежно чтбы один <input type="number" id="count3" value="1" min="1" /> был связан с радио кнопками а другой <input type="number" id="count3" value="1" min="1" /> прибовлялся к сумме <input type="number" id="count3" value="1" min="1" /> и type="radio" .Вот код

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="elevator">
<input type="radio" id="lift" class="a1" value="200" name="itemtype1" checked />
  <span id="lift2">200</span>
  <input type="radio" id="net_lift" class="a1" value="150" name="itemtype1" /> 150
  <input type="radio" id="net_lift" class="a1" value="10" name="itemtype1" /> 150
  <input type="radio" id="net_lift" class="a1" value="1500" name="itemtype1" /> 150
<br/>
 
 
  <input type="number" id="count2" name="Количество2" value="0" min="0" />
  <input type="number" id="count3" name="Количество3" value="0" min="0" />
</div>
 
<br> Итого:
<span id="final_price_yslug">0</span> руб
 
<script>
jQuery(function($) {
  var calc = function() {
    var price = 0;
    $('#elevator .a1:checked').each(function() {
      price += parseInt($(this).val());
    });
    price *= Math.max(1, parseInt($('#count2').val()));
    price *= Math.max(1, parseInt($('#count3').val()));
    $('#final_price_yslug').text(price);
  };
  $('#elevator .a1').on('change', calc);
  $('#elevator #count2, #elevator #count3').on('input', calc);
});
</script>
     
</body>
</html>

laimas · #2 (**permalink**) 17.06.2020, 08:53

Вы читали что писали для вас?
Это что такое d="net_lift" у трех полей?
Это $('#elevator .a1:checked').each.... зачем?

Что касается пояснений, то ничего не понятно что к чему связано - трижды приводите одно и тоже поле, а какие-то связи иные.

Лунтик · #3 (**permalink**) 17.06.2020, 08:56

НЕ смотрите я непонимаю одного гак сделать чтобы один инпуд был связн с радио кнопками другой был сам по себе.

Лунтик · #4 (**permalink**) 17.06.2020, 09:01

Все я разобрался.Подумал и вот что получил

<html>
<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
</head>
<body>
<div id="elevator">
    <label><input type="radio" class="a1" value="1" name="itemtype1" checked /> 200</label>
    <label><input type="radio" class="a1" value="2" name="itemtype1" /> 250</label>
    <label><input type="radio" class="a1" value="3" name="itemtype1" /> 300</label>
    <label><input type="radio" class="a1" value="4" name="itemtype1" /> 350</label>
    <br/>
  
  
    <input type="number" id="count2" value="0" min="0" />
    <input type="number" id="count3" value="0" min="1" />
</div>

<span id="final_price_yslug">0</span>

<script>
$('#elevator').on('change input', 'input', function(e) {
    var price = $(e.delegateTarget).find('input:radio:checked').val() * $('#count2').val() ;
    $('#final_price_yslug').text((price+ ($('#count3').val()*10)).toLocaleString('ru-RU', { style: 'currency', currency: 'RUB' }))
});
</script>
</body>
</html>

laimas · #5 (**permalink**) 17.06.2020, 09:08

Только не так, иначе если не будет выбора количества в count2, то будет 0 в результате. Если такое допустимо, то ладно, иначе так как вам ранее писали:

заменить $('#count2').val()
на
Math.max(1, parseInt($('#count2').val()))
или на такое
parseInt($('#count2').val()) || 1

в этом случае если значение будет 0, то значение выбранной радио кнопки будет умножаться на 1.

Лунтик · #6 (**permalink**) 17.06.2020, 09:14

А можно полную версию прислать а тоя с
трудом понимаю что сам написал.

laimas · #7 (**permalink**) 17.06.2020, 09:15

Сообщение от Лунтик

$('#count3').val()*10

А зачем умножать, можно шаг изменения сделать равным 10.

Лунтик · #8 (**permalink**) 17.06.2020, 09:19

Нет смотри мне нужно было сделать вот как тут https://rumexpert.ru/kalkulyator.html
хотябы механику и у меня получилось.
Вот код

<html>
<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
</head>
<body>
<div id="elevator">
    <label><input type="radio" class="a1" value="1" name="itemtype1" checked /> 200</label>
    <label><input type="radio" class="a1" value="2" name="itemtype1" /> 250</label>
    <label><input type="radio" class="a1" value="3" name="itemtype1" /> 300</label>
    <label><input type="radio" class="a1" value="4" name="itemtype1" /> 350</label>
    <br/>
  
  
    <input type="number" id="count2" value="0" min="0" />
    <input type="number" id="count3" value="0" min="0" />
	 <input type="number" id="count4" value="0" min="0" />
</div>

<span id="final_price_yslug">0</span>

<script>
$('#elevator').on('change input', 'input','input', function(e) {
    var price = $(e.delegateTarget).find('input:radio:checked').val() * $('#count2').val() ;
    $('#final_price_yslug').text((price+ ($('#count3').val()*10)+($('#count4').val()*10)).toLocaleString('ru-RU', { style: 'currency', currency: 'RUB' }))
});
</script>
</body>
</html>

laimas · #9 (**permalink**) 17.06.2020, 09:27

Сообщение от Лунтик

А можно полную версию прислать а тоя с

Написать то можно, но я не знаю логики как должно быть.

У count2 указано значение по умолчанию равное 0 и минимальное 0. Из этого следует, что можно ничего не выбирать в этом поле. Но тогда значение выбранной itemtype1 умноженное на count2 будет равно 0. Есть смысл считать далее?

А тут count3 value="0" min="1", это ошибка в общем-то, если мин. значение 1, то значение никак не может быть 0.

Вот эту строку переписать так (если у count2 значение по умолчанию равное 0 и минимальное 0, это так и надо, может быть не указано)

var price = $(e.delegateTarget).find('input:radio:checked').val() * $('#count2').val(); //так сейчас
//заменить на
var price = $(e.delegateTarget).find('input:radio:checked').val() * +$('#count2').val() || 1;

Если и в count3 можно не вводить, то мин. значение его должно быть равно 0. А расчет по нему так:

(price+ ($('#count3').val()*10)) //это заменить на 
(price + $('#count3').val() * 10)

laimas · #10 (**permalink**) 17.06.2020, 09:37

Сообщение от Лунтик

price+ ($('#count3').val()*10)

В школе чему учили? Какое действие сначала будет выполнено - умножение или сложение? Зачем умножение в скобки?

Что касается умножить на 10 и это прибавить к сумме ранее найденной, то какой-то бред получается. Радио кнопки, это какой-то материал или т.п. Далее цена выбранного материала умножается на какое-то количество count2. Если count2 = 0, то price = 0. Что даст 0 + $('#count3').val()*10? Это что будет?

Логику калькулятора своего поясните нормально, функцию по которой нужно считать, иначе ...

Форум

Справочник

Discord чат

Курсы javascript