21.10.2013, 17:23
|
|
Профессор
|
|
Регистрация: 23.06.2011
Сообщений: 1,165
|
|
Сообщение от coloboque
|
Я попробовала через - d.getElementById('2dveri').disabled = true; - становится неактивной серой как и чекбокс пескоструных рисунков.
|
Думаю, это даже правильнее с точки зрения UI, чем убирать пункт полностью, показать, что такой пункт возможен, но в данной конфигурации он неактивен. Тогда всё? Вопросов не осталось?
|
|
21.10.2013, 19:08
|
Новичок на форуме
|
|
Регистрация: 20.10.2013
Сообщений: 8
|
|
Нет еще не все)))) потрепите меня)) я переделала код под новые входные данные. Теперь цена есть за 1 дверь - дверь до 600мм, дверь до 800мм, дверь до 1200(это максимальная возможная ширина двери)
вот что у меня получилось:
http://yarkoyarko.ru/calc3.html
Проблемы:
1)пока не выбранно количество дверей - получается Infinity. Я думала от деления на 0) Я и убирала 0 из value и заменяла еденицей - не помогло...
2) И автоматическое перескакивание пропало...
Последний раз редактировалось coloboque, 21.10.2013 в 19:14.
|
|
21.10.2013, 20:22
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,123
|
|
coloboque,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<form id="form" name="form">
<input id="vis" type="text" value="2300" /> высота, в мм
<br/>
<input id="shir" type="text" value="3800" /> ширина, в мм
<br/>
<b>Наполнение:</b>
<br/>
<select id="fill">
<option>Выбрать</option>
<option value="1300">Стекло</option>
<option value="1500">Зеркало </option>
<option value="1400">Ротанг</option>
<option value="1400">ДСП</option>
</select><br/>
<div>Рекомендованное количество дверей: <span id="recdver">0</span> шт.</div>
<div>Минимальное количество дверей: <span id="mindver">0</span> шт.</div>
<b>Кол-во дверей:</b>
<br/>
<select id="dveri">
<option value="0">Выбрать</option>
<option id="2dveri" value="2">2</option>
<option id="3dveri" value="3">3</option>
<option id="4dveri" value="4">4</option>
<option id="5dveri" value="5">5</option>
<option id="6dveri" value="6">6</option>
<option id="7dveri" value="7">7</option>
<option id="8dveri" value="8">8</option>
</select>
<div>Ширина 1ой двери: <span id="sh1dver">0</span> мм.</div>
<br/>
<input type="checkbox" value="1000" id="dost" />
<label for="dost">Требуется доставка?</label>
<br/>
<input type="checkbox" value="700" id="ust" />
<label for="ust">Требуется установка?</label>
<br/>
<input type="checkbox" value="1350" id="ris" />
<label for="ris">Нанесение пескоструйных рисунков</label>
<div>Примерная стоимость дверей: <span id="result">0</span> руб.</div>
</form>
<script>
document.body.onload = function() {
function calc() {
var d = document, profil = risunok = ustanovka = dostavka = 0;
var vis = +d.getElementById("vis").value,
shir = +d.getElementById("shir").value,
dveri = d.getElementById("dveri"),
fill = d.getElementById("fill"),
dost = d.getElementById("dost"),
ust = d.getElementById("ust"),
ris = d.getElementById("ris"),
result = d.getElementById("result"),
recvder = d.getElementById("recvder");
mindver = d.getElementById("mindver");
sh1dver = d.getElementById("sh1dver");
if (vis > 2600) {alert('К сожалению, мы производим двери высотой только до 2600мм! Введите другое значение')
};
if (shir < 600) {alert('Шкаф слишком узкий!')
};
var rec;
rec = Math.ceil(shir/800);
var mindveri;
mindveri = Math.ceil(shir/1200);
if(mindveri >= 3) {
if(dveri.options[dveri.selectedIndex].value == '2') {dveri.options[2].selected = true;}
d.getElementById('2dveri').disabled = true;
}
else d.getElementById('2dveri').disabled = false;
if(mindveri >= 4) {
if(dveri.options[dveri.selectedIndex].value == '3') {dveri.options[3].selected = true;}
d.getElementById('3dveri').disabled = true;
}
else d.getElementById('3dveri').disabled = false;
if(mindveri >= 5) {
if(dveri.options[dveri.selectedIndex].value == '4') {dveri.options[4].selected = true;}
d.getElementById('4dveri').disabled = true;
}
else d.getElementById('4dveri').disabled = false;
if(fill.selectedIndex == 3 || fill.selectedIndex == 4) {
ris.checked = false;
ris.disabled = true;
} else {
ris.disabled = false;
};
var sq = shir * vis / 1000000,
cdveri = +dveri.value||mindveri;
var shirdver;
shirdver = Math.ceil(shir/cdveri);
if (shirdver <= 600) profil = 2472 * cdveri;
else if (shirdver <= 800) profil = 2666 * cdveri;
else if (shirdver <= 1200) profil = 3053.5 * cdveri;
if (ust.checked) ustanovka = +ust.value * cdveri;
if (dost.checked) dostavka = +dost.value;
if (ris.checked) risunok = +ris.value * cdveri;
recdver.innerHTML = rec;
mindver.innerHTML = mindveri;
sh1dver.innerHTML = shirdver;
result.innerHTML = Math.ceil(sq +(+fill.value||0) + profil + dostavka + ustanovka + risunok );
};
document.form.onchange = calc;
calc();
}
</script>
</body>
</html>
|
|
21.10.2013, 20:34
|
|
Профессор
|
|
Регистрация: 23.06.2011
Сообщений: 1,165
|
|
Сообщение от coloboque
|
потрепите меня
|
я бы с удовольствием, но жена не разрешает трепать незнакомых девушек
|
|
21.10.2013, 23:44
|
Новичок на форуме
|
|
Регистрация: 20.10.2013
Сообщений: 8
|
|
Да и терпеть незнакомых девиц тоже не преветсвуется думаю))Планшет смешные перлы выдает уже не раз)) это еще не самое смешное!!)
Спасибо всем огромное за помощь! Калькулятор объявляю готовым)по крайней мере свою главную функцию он выполняет!
|
|
17.02.2015, 07:46
|
Интересующийся
|
|
Регистрация: 09.04.2014
Сообщений: 13
|
|
Добрый день! Решил переделать данный калькулятор для расчета стоимости кровли но т.к. знания поверхностные не могу понять где допустил ошибки. Сильно не ругайте все пытался делать методом тыка.
Вроде считает общую сумму но немогу настроить вывод кол-ва листов шифера и стоимости 1 шт. в зависимости от цвета.
Подскажите, что я упустил или чего перебрал? )) И как можно сделать так чтобы подсчет выводился сразу при вводе площади, а не по клику в другой области? вывод количества листов считается S/1.336 m.
Может кому потом пригодятся подобные наработки)
<!DOCTYPE HTML>
<html>
<head>
<title>Калькулятор - расчет стоимости кровли</title>
<meta charset="utf-8">
</head>
<body>
<form id="form" name="form">
<br/>
<input type="radio" id="color1" name="cena" value="272" checked />Серый
<input type="radio" id="color2" name="cena" value="285" />Красный
<input type="radio" id="color3" name="cena" value="275" />Зеленый
<input type="radio" id="color4" name="cena" value="235" />Сланец
<br/><br/>
<b> ПЛОЩАДЬ КРОВЛИ:</b> <input id="area" type="text" value="5" /> <b>м2</b>
<br/>
<br/>
<div>Цена: <span id="cena">0</span> руб.</div>
<div>Рекомендованное количество шифера: <span id="kol">0</span> шт.</div>
<div>Сумма: <span id="result">0</span> руб.</div>
</form>
<script>
document.body.onload = function() {
function calc() {
var d = document, cena = color1 = color2 = color3 = color4 = 0;
var area = +d.getElementById("area").value,
color1 = d.getElementById("color1"),
color2 = d.getElementById("color2"),
color3 = d.getElementById("color3"),
color4 = d.getElementById("color4"),
result = d.getElementById("result"),
kol = d.getElementById("kol");
if (area > 90000) {alert('Вы уверены в правильности введенных данных? Введите другое значение')
};
if (area < 2) {alert('Площадь слишком мала!')
};
var kol;
kol = Math.ceil(area/1.336);
if (color1.checked) cena = +color1.value;
if (color2.checked) cena = +color2.value;
if (color3.checked) cena = +color3.value;
if (color4.checked) cena = +color3.value;
kol.innerHTML = Math.ceil(area/1.336);
cena.innerHTML = cena;
result.innerHTML = Math.ceil(kol * cena);
};
document.form.onchange = calc;
calc();
}
</script>
</body>
</html>
|
|
17.02.2015, 09:09
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,123
|
|
Сообщение от koyot777
|
что я упустил или чего перебрал
|
перепишите название переменных так чтоб они не совпадали с id элементов
Сообщение от koyot777
|
var area = +d.getElementById("area").value,
|
Сообщение от koyot777
|
подсчет выводился сразу при вводе площади
|
строка 94
document.getElementById("area").oninput = calc;
|
|
25.02.2015, 13:12
|
Интересующийся
|
|
Регистрация: 09.04.2014
Сообщений: 13
|
|
Сообщение от рони
|
перепишите название переменных так чтоб они не совпадали с id элементов
строка 94
document.getElementById("area").oninput = calc;
|
Спасибо за помощь.
Скрипт начал выводить кол-во шифера и сумму, но никак не могу заставить его выводить значение цены товара в зависимости от выбора радио кнопки.
поскажите, что у меня там опять не так?
<form id="form" name="form">
<div class="calc-bgarea">
<input type="radio" id="color1" name="cena" value="100" checked />Серый
<input type="radio" id="color2" name="cena" value="285" />Красный<br/>
<input type="radio" id="color3" name="cena" value="275" />Зеленый
<input type="radio" id="color4" name="cena" value="235" />Сланец
<br/>
<br/>
<b> ПЛОЩАДЬ КРОВЛИ:</b> <input id="area" type="text" value="5" /> <b>M<sup>2</sup></b>
<br/>
<br/>
</div>
<div class="calc-bg2">
пример сообщения
</div>
<div class="calc-bgtotal">
Цена: <br>
Кол-во листов: <br>
Итого: <br>
<div class="calc-bgtotal2">
<span id="cena">0</span> руб.<br>
<span id="kol">0</span> шт.<br>
<span id="result">0</span> руб.
</div>
</div>
</form>
<script>
document.body.onload = function() {
function calc() {
var d = document, cena = color1 = color2 = color3 = color4 = 0;
var areaa = +d.getElementById("area").value,
color1 = d.getElementById("color1"),
color2 = d.getElementById("color2"),
color3 = d.getElementById("color3"),
color4 = d.getElementById("color4"),
result = d.getElementById("result"),
kol = d.getElementById("kol");
var kolich;
kolich = Math.ceil(areaa/1.336);
if (color1.checked) cena = +color1.value;
if (color2.checked) cena = +color2.value;
if (color3.checked) cena = +color3.value;
if (color4.checked) cena = +color4.value;
kol.innerHTML = Math.ceil(areaa/1.336);
cena.innerHTML = cena;
result.innerHTML = Math.ceil(kolich * cena);
};
document.form.onchange = calc;
document.getElementById("area").oninput = calc;
calc();
}
</script>
|
|
25.02.2015, 13:47
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,123
|
|
Сообщение от рони
|
перепишите название переменных так чтоб они не совпадали с id элементов
|
Сообщение от koyot777
|
cena.innerHTML = cena;
|
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<form id="form" name="form">
<div class="calc-bgarea">
<input type="radio" id="color1" name="cena" value="100" checked />Серый
<input type="radio" id="color2" name="cena" value="285" />Красный<br/>
<input type="radio" id="color3" name="cena" value="275" />Зеленый
<input type="radio" id="color4" name="cena" value="235" />Сланец
<br/>
<br/>
<b> ПЛОЩАДЬ КРОВЛИ:</b> <input id="area" type="text" value="5" /> <b>M<sup>2</sup></b>
<br/>
<br/>
</div>
<div class="calc-bg2">
пример сообщения
</div>
<div class="calc-bgtotal">
Цена: <span id="cena">0</span> руб.<br>
Кол-во листов: <span id="kol">0</span> шт.<br>
Итого: <span id="result">0</span> руб.<br>
</div>
</form>
<script>
document.body.onload = function() {
function calc() {
var d = document, price = 0;
areaa = +d.getElementById("area").value,
kolich = Math.ceil(areaa/1.336),
color1 = d.getElementById("color1"),
color2 = d.getElementById("color2"),
color3 = d.getElementById("color3"),
color4 = d.getElementById("color4"),
result = d.getElementById("result"),
kol = d.getElementById("kol");
if (color1.checked) price = +color1.value;
if (color2.checked) price = +color2.value;
if (color3.checked) price = +color3.value;
if (color4.checked) price = +color4.value;
kol.innerHTML = kolich;
cena.innerHTML = price;
result.innerHTML = Math.ceil(kolich * price);
};
document.form.onchange = calc;
document.getElementById("area").oninput = calc;
calc();
}
</script>
</body>
</html>
|
|
|
|