Помогите пожалуйста !
У меня есть код и мне нежно чтбы один <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>
|
Вы читали что писали для вас?
Это что такое d="net_lift" у трех полей? Это $('#elevator .a1:checked').each.... зачем? Что касается пояснений, то ничего не понятно что к чему связано - трижды приводите одно и тоже поле, а какие-то связи иные. |
НЕ смотрите я непонимаю одного гак сделать чтобы один инпуд был связн с радио кнопками другой был сам по себе.
|
Все я разобрался.Подумал и вот что получил
<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>
|
Только не так, иначе если не будет выбора количества в count2, то будет 0 в результате. Если такое допустимо, то ладно, иначе так как вам ранее писали:
заменить $('#count2').val() на Math.max(1, parseInt($('#count2').val())) или на такое parseInt($('#count2').val()) || 1 в этом случае если значение будет 0, то значение выбранной радио кнопки будет умножаться на 1. |
А можно полную версию прислать а тоя с
трудом понимаю что сам написал. |
Цитата:
|
Нет смотри мне нужно было сделать вот как тут 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>
|
Цитата:
У 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)
|
Цитата:
Что касается умножить на 10 и это прибавить к сумме ранее найденной, то какой-то бред получается. Радио кнопки, это какой-то материал или т.п. Далее цена выбранного материала умножается на какое-то количество count2. Если count2 = 0, то price = 0. Что даст 0 + $('#count3').val()*10? Это что будет? Логику калькулятора своего поясните нормально, функцию по которой нужно считать, иначе ... |
| Часовой пояс GMT +3, время: 04:02. |