PDA

Просмотр полной версии : Программирование на JS


Bobr
25.04.2006, 16:42
Передо мной встала задача о том, что нужно сделать калькулятор услуг для сайта полиграфии.
Купил учебник...читал...пробовал.
Вот что получилось:

<SCRIPT type=text/javascript>
<!--
function count () {

// Стоимости
var id01cost = 3.30;
var id02cost = 2.80;
var id03cost = 2.30;
var id04cost = 2.00;
var id05cost = 6.60;
var id06cost = 5.60;
var id07cost = 4.60;
var id08cost = 4.00;
var id09cost = 1.00;
var id10cost = 0.80;
var id11cost = 0.65;
var id12cost = 0.50;
var id13cost = 2.00;
var id14cost = 1.60;
var id15cost = 1.30;
var id16cost = 1.00;
var id17cost = 4.30;
var id18cost = 3.60;
var id19cost = 2.95;
var id20cost = 2.50;




// Введённые значения
var id01 = document.form1.id01.value;
var id02 = document.form1.id02.value;
var id03 = document.form1.id03.value;
var id04 = document.form1.id04.value;
var id05 = document.form1.id05.value;
var id06 = document.form1.id06.value;
var id07 = document.form1.id07.value;
var id08 = document.form1.id08.value;
var id09 = document.form1.id09.value;
var id10 = document.form1.id10.value;
var id11 = document.form1.id11.value;
var id12 = document.form1.id12.value;
var id13 = document.form1.id13.value;
var id14 = document.form1.id14.value;
var id15 = document.form1.id15.value;
var id16 = document.form1.id16.value;
var id17 = document.form1.id17.value;
var id18 = document.form1.id18.value;
var id19 = document.form1.id19.value;
var id20 = document.form1.id20.value;


// Подсчёт
id01total = id01*id01cost;
id02total = id02*id02cost;
id03total = id03*id03cost;
id04total = id04*id04cost;
id05total = id05*id05cost;
id06total = id06*id06cost;
id07total = id07*id07cost;
id08total = id08*id08cost;
id09total = id09*id09cost;
id10total = id10*id10cost;
id11total = id11*id11cost;
id12total = id12*id12cost;
id13total = id13*id13cost;
id14total = id14*id14cost;
id15total = id15*id15cost;
id16total = id16*id16cost;
id17total = id17*id17cost;
id18total = id18*id18cost;
id19total = id19*id19cost;
id20total = id20*id20cost;

// Вывод
document.form1.id01price.value = id01total;
document.form1.id02price.value = id02total;
document.form1.id03price.value = id03total;
document.form1.id04price.value = id04total;
document.form1.id05price.value = id05total;
document.form1.id06price.value = id06total;
document.form1.id07price.value = id07total;
document.form1.id08price.value = id08total;
document.form1.id09price.value = id09total;
document.form1.id10price.value = id10total;
document.form1.id11price.value = id11total;
document.form1.id12price.value = id12total;
document.form1.id13price.value = id13total;
document.form1.id14price.value = id14total;
document.form1.id15price.value = id15total;
document.form1.id16price.value = id16total;
document.form1.id17price.value = id17total;
document.form1.id18price.value = id18total;
document.form1.id19price.value = id19total;
document.form1.id20price.value = id20total;


// Общая сумма
document.form1.total.value = id01total + id02total + id03total + id04total + id05total + id06total + id07total + id08total + id09total + id10total + id11total + id12total + id13total + id14total + id15total + id16total + id17total + id18total + id19total + id20total;

}
-->
</SCRIPT>

<FORM name=form1 style="FONT: 11px tahoma">
<table style="FONT: 11px tahoma" width="500">
<tr>
<td><b>Исполнение</b></td>
<td align="center">24...120</td>
<td align="center">121...240</td>
<td align="center">241...600</td>
<td align="center">Более 600</td>
</tr>
<tr bgcolor="#F4F4F4">
<td>Полноцветные односторонние</td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id01></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id01price></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id03></td>
<td align="center"><INPUT MAXLENGTH=4 size=4 name=id04></td>
</tr>
<tr>
<td>Полноцветные двусторонние</td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id05></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id06></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id07></td>
<td align="center"><INPUT MAXLENGTH=4 size=4 name=id08></td>
</tr>
<tr bgcolor="#F4F4F4">
<td>Черно-белые односторонние</td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id09></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id10></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id11></td>
<td align="center"><INPUT MAXLENGTH=4 size=4 name=id12></td>
</tr>
<tr>
<td>Черно-белые двусторонние</td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id13></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id14></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id15></td>
<td align="center"><INPUT MAXLENGTH=4 size=4 name=id16></td>
</tr>
<tr bgcolor="#F4F4F4">
<td>Одна сторона полноцветная<br>Вторая черно-белая</td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id17></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id18></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id19></td>
<td align="center"><INPUT MAXLENGTH=4 size=4 name=id20></td>
</tr>
</table>
<table style="FONT: 11px tahoma" width="500">
<tr>
<td><b>Общая стоимость:</b> <INPUT size=17 style="height: 20px; font: 11px tahoma" value="Общая стоимость" name=total>&nbsp;<INPUT style="font: 11px tahoma" onclick=count(); type=button value=Посчитать>&nbsp;<INPUT style="font: 11px tahoma" type=RESET value=Сбросить></td>
</tr>
</table>
</form>


Только вот считать она не хочет :(
Если тут есть профессионалы или любители, помогите пожалуйста

вегуд
26.04.2006, 19:08
непонятно - что надо вводить в эти поля

вегуд
26.04.2006, 19:16
в любом случае, вот подправленный скрипт


<SCRIPT type=text/javascript>
<!--
function count () {
// Стоимости
var id01cost = 3.30;
var id02cost = 2.80;
var id03cost = 2.30;
var id04cost = 2.00;
var id05cost = 6.60;
var id06cost = 5.60;
var id07cost = 4.60;
var id08cost = 4.00;
var id09cost = 1.00;
var id10cost = 0.80;
var id11cost = 0.65;
var id12cost = 0.50;
var id13cost = 2.00;
var id14cost = 1.60;
var id15cost = 1.30;
var id16cost = 1.00;
var id17cost = 4.30;
var id18cost = 3.60;
var id19cost = 2.95;
var id20cost = 2.50;


// Введённые значения
var form = (document.getElementById('form1'));
var id01 = form['id01'].value;
var id02 = form['id02'].value;
var id03 = form['id03'].value;
var id04 = form['id04'].value;
var id05 = form['id05'].value;
var id06 = form['id06'].value;
var id07 = form['id07'].value;
var id08 = form['id08'].value;
var id09 = form['id09'].value;
var id10 = form['id10'].value;
var id11 = form['id11'].value;
var id12 = form['id12'].value;
var id13 = form['id13'].value;
var id14 = form['id14'].value;
var id15 = form['id15'].value;
var id16 = form['id16'].value;
var id17 = form['id17'].value;
var id18 = form['id18'].value;
var id19 = form['id19'].value;
var id20 = form['id20'].value;

// Подсчёт
id01total = id01*id01cost;
id02total = id02*id02cost;
id03total = id03*id03cost;
id04total = id04*id04cost;
id05total = id05*id05cost;
id06total = id06*id06cost;
id07total = id07*id07cost;
id08total = id08*id08cost;
id09total = id09*id09cost;
id10total = id10*id10cost;
id11total = id11*id11cost;
id12total = id12*id12cost;
id13total = id13*id13cost;
id14total = id14*id14cost;
id15total = id15*id15cost;
id16total = id16*id16cost;
id17total = id17*id17cost;
id18total = id18*id18cost;
id19total = id19*id19cost;
id20total = id20*id20cost;


// Вывод
/*
form['id01price'].value = id01total;
form['id02price'].value = id02total;
form['id03price'].value = id03total;
form['id04price'].value = id04total;
form['id05price'].value = id05total;
form['id06price'].value = id06total;
form['id07price'].value = id07total;
form['id08price'].value = id08total;
form['id09price'].value = id09total;
form['id10price'].value = id10total;
form['id11price'].value = id11total;
form['id12price'].value = id12total;
form['id13price'].value = id13total;
form['id14price'].value = id14total;
form['id15price'].value = id15total;
form['id16price'].value = id16total;
form['id17price'].value = id17total;
form['id18price'].value = id18total;
form['id19price'].value = id19total;
form['id20price'].value = id20total;
*/

// Общая сумма
form['total'].value = id01total + id02total + id03total + id04total + id05total + id06total + id07total + id08total + id09total + id10total + id11total + id12total + id13total + id14total + id15total + id16total + id17total + id18total + id19total + id20total;
}
-->
</SCRIPT>
<FORM name=form1 style="FONT: 11px tahoma" id="form1">
<table style="FONT: 11px tahoma" width="500">
<tr>
<td><b>Исполнение</b></td>
<td align="center">24...120</td>
<td align="center">121...240</td>
<td align="center">241...600</td>
<td align="center">Более 600</td>
</tr>
<tr bgcolor="#F4F4F4">
<td>Полноцветные односторонние</td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id01></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id02></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id03></td>
<td align="center"><INPUT MAXLENGTH=4` size=4 name=id04></td>
</tr>
<tr>
<td>Полноцветные двусторонние</td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id05></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id06></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id07></td>
<td align="center"><INPUT MAXLENGTH=4 size=4 name=id08></td>
</tr>
<tr bgcolor="#F4F4F4">
<td>Черно-белые односторонние</td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id09></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id10></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id11></td>
<td align="center"><INPUT MAXLENGTH=4 size=4 name=id12></td>
</tr>
<tr>
<td>Черно-белые двусторонние</td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id13></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id14></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id15></td>
<td align="center"><INPUT MAXLENGTH=4 size=4 name=id16></td>
</tr>
<tr bgcolor="#F4F4F4">
<td>Одна сторона полноцветная<br>Вторая черно-белая</td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id17></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id18></td>
<td align="center"><INPUT MAXLENGTH=3 size=3 name=id19></td>
<td align="center"><INPUT MAXLENGTH=4 size=4 name=id20></td>
</tr>
</table>
<table style="FONT: 11px tahoma" width="500">
<tr>
<td><b>Общая стоимость:</b> <INPUT size=17 style="height: 20px; font: 11px tahoma" value="Общая стоимость" name=total>&nbsp;<INPUT style="font: 11px tahoma" onclick=count(); type=button value=Посчитать>&nbsp;<INPUT style="font: 11px tahoma" type=RESET value=Сбросить></td>
</tr>
</table>
</form>


поскольку полей для вывода промежуточных сумм (id01price, id02price...) просто нет на странице, я участок кода который их выводит закомментировал

приведенный скрипт по сути своей уебищный
если так действительно советуют делать в учебнике - поменяй его

Bobr
26.04.2006, 20:51
В учебнике ни кто не советует так, там вообще ничего по калькуляторам нет...это я попытался сделать всё своими корявыми ручками.
Тот участок кода для вывода промежуточных сумм я не включил, но подразумевал то что на странице будет несколько таблиц с ценами и общая сумма на них будет выводиться внизу.
И как присандалить к этому 2 input radio к которым будут прикреплены разные цены?

Я хотел сделать скрипт калькулятора для этого прайса: http://www.aprosh.ru/services/id2/
И ещё сделать два input radio (С ламинированием и без)

Bobr
27.04.2006, 11:27
А можно слелать на js, на основе уже имеющегося калькулятора
как тут: http://www.zs.ur.ru/90