Скрипт для калькулятора
Ребят, доброго вечера. Помогите со скриптом.
Нужен скрипт для формы расчета. Форма буде содержать 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руб. и так далее. Заранее спасибо) |
<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> |
А вот формулы, увы, нет(((
|
Со скриптами только на Вы
|
Так формулы расчета не будет. Для каждого сочетания селектов свой результат:
tirazh=1 razmer=size1 cvet=1 nanesenie=1 То результат = 500руб. Соответственно, при другой комбинации селектов результат будет другим. |
Этих комбинаций будет порядка 500шт.
|
<!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> |
или такая вложенность.
но лучше найти кую-то закономерность и все сильно сократится 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; }; |
Еще вопрос: как в скрипте поставить значение списка "cvet" - он зависим от списка "razmer" и тоже принимает значение.
|
а подробнее?
|
Часовой пояс GMT +3, время: 01:41. |