Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Скрипт для калькулятора (https://javascript.ru/forum/misc/70758-skript-dlya-kalkulyatora.html)

Леонид777 30.09.2017 22:20

Скрипт для калькулятора
 
Ребят, доброго вечера. Помогите со скриптом.
Нужен скрипт для формы расчета.
Форма буде содержать 4 селекта и, собственно, результат.

1. Тираж. Выбирается из списка (10, 20, 30, 40)
2. Размер пакета (15*15, 30*30, 40*45)
3. Цвет пакета. Список зависит от размера пакета (15*15 (белый, черный),
30*30(красный, белый, синий), 40*45 (белый, красный, черный)..
4. Количество цветов нанесения. Выбирается из списка (1+0, 2+0, 3+0).

Результат выводится без расчета:
Если 1=10
2=3(40*45)
3=2(белый)
4=2(2+0)
то результат = 500руб.

Если 1=20
2=2(30*30)
3=2(белый)
4=2(2+0)
то результат = 800руб.

и так далее.

Заранее спасибо)

Леонид777 30.09.2017 22:40

<div>
<select id="tirazh">
<option disabled selected></option>
<option value="1">100шт</option>
<option value="2">200шт</option>
<option value="3">300шт</option>
<option value="4">400шт</option>
<option value="5">500шт</option>
<option value="6">600шт</option>
<option value="7">700шт</option>
<option value="8">800шт</option>
<option value="9">900шт</option>
<option value="10">1000шт</option>
<option value="11">1500шт</option>
<option value="12">2000шт</option>
</select> - Тираж; <br /> <br />

<select id="razmer">
<option disabled selected></option>
<option value="size1">22,5 х 34см</option>
<option value="size2">30 х 40см</option>
<option value="size3">36 х 45см</option>
<option value="size4">38 х 50см</option>
<option value="size5">45 х 50см</option>
<option value="size6">60 х 50см</option>
<option value="size7">70 х 50см</option>
</select> - Размер пакета; <br /> <br />

<select id="cvet">
</select> - Цвет пакета; <br /> <br />

<select id="nanesenie">
<option disabled selected></option>
<option value="1">1 + 0</option>
<option value="2">2 + 0</option>
<option value="3">3 + 0</option>
<option value="4">4 + 0</option>
</select> - Количество цветов нанесения; <br /> <br />

<button onclick="Start();">Рассчитать!</button>

<div style="font-weight:bold" id="result"></div>
</div>

Леонид777 30.09.2017 22:51

А вот формулы, увы, нет(((

Леонид777 30.09.2017 22:51

Со скриптами только на Вы

Леонид777 30.09.2017 23:07

Так формулы расчета не будет. Для каждого сочетания селектов свой результат:
tirazh=1
razmer=size1
cvet=1
nanesenie=1
То результат = 500руб.
Соответственно, при другой комбинации селектов результат будет другим.

Леонид777 30.09.2017 23:13

Этих комбинаций будет порядка 500шт.

j0hnik 30.09.2017 23:29

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<div>
		<select id="tirazh"> 
			<option selected></option>
			<option value="1">100шт</option>
			<option value="2">200шт</option> 
			<option value="3">300шт</option> 
			<option value="4">400шт</option>
			<option value="5">500шт</option> 
			<option value="6">600шт</option> 
			<option value="7">700шт</option> 
			<option value="8">800шт</option>
			<option value="9">900шт</option> 
			<option value="10">1000шт</option> 
			<option value="11">1500шт</option>
			<option value="12">2000шт</option> 
		</select> - Тираж; <br /> <br /> 

		<select id="razmer"> 
			<option  selected></option>
			<option value="size1">22,5 х 34см</option>
			<option value="size2">30 х 40см</option> 
			<option value="size3">36 х 45см</option> 
			<option value="size4">38 х 50см</option>
			<option value="size5">45 х 50см</option> 
			<option value="size6">60 х 50см</option> 
			<option value="size7">70 х 50см</option> 
		</select> - Размер пакета; <br /> <br />

		<select id="cvet"> 
		</select> - Цвет пакета; <br /> <br /> 

		<select id="nanesenie"> 
			<option selected></option> 
			<option value="1">1 + 0</option>
			<option value="2">2 + 0</option> 
			<option value="3">3 + 0</option> 
			<option value="4">4 + 0</option> 
		</select> - Количество цветов нанесения; <br /> <br />

		<button>Рассчитать!</button> 

		<div style="font-weight:bold" id="result"></div> 
	</div>
	<script>

		var tirazh = document.querySelector("#tirazh"),
		razmer = document.querySelector("#razmer"),
		nanesenie = document.querySelector("#nanesenie"),
		summ = 0;

		document.querySelector("button").onclick=function(){
			if (tirazh.value == '1' && razmer.value  == 'size1' && nanesenie.value  == '1') summ = 500;
			else if (tirazh.value == '1' && razmer.value  == 'size1' && nanesenie.value  == '2') summ = 600;
			else if (tirazh.value == '1' && razmer.value  == 'size1' && nanesenie.value  == '3') summ = 700;
			//итд
			document.querySelector("#result").textContent = summ;
		};
</script>
</body>
</html>

j0hnik 30.09.2017 23:39

или такая вложенность.
но лучше найти кую-то закономерность и все сильно сократится

document.querySelector("button").onclick=function(){
			if (tirazh.value == '1') {
				if (razmer.value == 'size1') {
					if (nanesenie.value == '1') summ = 500;
					else if (nanesenie.value == '2') summ = 600;
					//итд
				}
				else if (razmer.value == 'size2') {
					if (nanesenie.value == '1') summ = 700;
					else if (nanesenie.value == '2') summ = 800;
					//итд
				}
			}
			else if (tirazh.value == '2') {
				if (razmer.value == 'size1') {
					if (nanesenie.value == '1') summ = 900;
					else if (nanesenie.value == '2') summ = 1000;
					//итд
				}
				else if (razmer.value == 'size2') {
					if (nanesenie.value == '1') summ = 1100;
					else if (nanesenie.value == '2') summ = 1200;
					//итд
				}
			}
			document.querySelector("#result").textContent = summ;
		};

Леонид777 30.09.2017 23:43

Еще вопрос: как в скрипте поставить значение списка "cvet" - он зависим от списка "razmer" и тоже принимает значение.

j0hnik 30.09.2017 23:47

а подробнее?


Часовой пояс GMT +3, время: 01:41.