Добавил:
Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:

Web-программирование. Интерактивность статических Интернет-сайтов с применением форм. Учебное пособие для СПО

.pdf
Скачиваний:
0
Добавлен:
06.09.2026
Размер:
1 Мб
Скачать
31
opods[2] = 'Вариант 12'; znods[2] = 12; opods[3] = 'Вариант 13'; znods[3] = 13; opods[4] = 'Вариант 14'; znods[4] = 14; // Множественный список opmns[0] = 'Вариант 21'; znmns[0] = 21; opmns[1] = 'Вариант 22'; znmns[1] = 22; opmns[2] = 'Вариант 23'; znmns[2] = 23; opmns[3] = 'Вариант 24'; znmns[3] = 24; // Однозначный выбор opodv[0] = 'Вариант 31'; znodv[0] = 31; opodv[1] = 'Вариант 32'; znodv[1] = 32; opodv[2] = 'Вариант 33'; znodv[2] = 33; opodv[3] = 'Вариант 34'; znodv[3] = 34; // Множественный выбор opmnv[0] = 'Вариант 41'; znmnv[0] = 41; opmnv[1] = 'Вариант 42'; znmnv[1] = 42; opmnv[2] = 'Вариант 43'; znmnv[2] = 43; opmnv[3] = 'Вариант 44'; znmnv[3] = 44;
</SCRIPT> <FORM name=fnam method=post> <TABLE border=1 bordercolor=green cellspacing=0> <TR align=center> <TD colspan=2><B>Исходные данные</B></TD> </TR><TR valign=top> <TD>Скрытый элемент</TD> <TD><INPUT type=hidden name=hdn value="Программа 3"></INPUT></TD> </TR><TR valign=top> <TD>Текстовое поле</TD> <TD><INPUT type=text name=tp value=01></INPUT></TD> </TR><TR valign=top> <TD>Текстовая область</TD> <TD><TEXTAREA rows=5 cols=40 name=tob>Введите текст</TEXTAREA> </TD></TR> <TR valign=top> <TD>Поле пароля</TD> <TD><INPUT type=password name=ps value="Введите пароль"></INPUT> </TD> </TR><TR valign=top> <TD>Загрузка файла</TD> <TD><INPUT type=file name=fl></INPUT></TD> </TR><TR valign=top> <TD>Однозначный список</TD> <TD> <SELECT name=ods> <OPTION value="Выберите вариант">Выберите вариант</OPTION> <SCRIPT language=JavaScript> for (n=1;n<opods.length;n++) { document.writeln("<OPTION value="+n+">"+opods[n]+"</OPTION>"); } </SCRIPT> </SELECT> </TD>
32
</TR><TR valign=top> <TD>Множественный список</TD> <TD> <SELECT name=mns multiple> <SCRIPT language=JavaScript> for (n=0;n<opmns.length;n++) { document.writeln("<OPTION value="+n+">"+opmns[n]+"</OPTION>"); } </SCRIPT> </SELECT> </TD> </TR><TR valign=top> <TD>Однозначный выбор</TD> <TD> <SCRIPT language=JavaScript> for (n=0;n<opodv.length;n++) { document.writeln("<INPUT type=radio name=odv value="+n+">"+ opodv[n]+"</INPUT><BR>"); } </SCRIPT> </TD> </TR><TR valign=top> <TD>Множественный выбор</TD> <TD> <SCRIPT language=JavaScript> for (n=0;n<opmnv.length;n++) { document.writeln("<INPUT type=checkbox name=mnv value="+n+">"+ opmnv[n]+"</INPUT><BR>"); } </SCRIPT> </TD> </TR><TR align=center> <TD> <INPUT type=button name=ras value="Расчет" onClick="rasf();"> </INPUT> </TD> <TD> <INPUT type=reset name=del value="Отмена" onClick="delf();" disabled></INPUT> </TD> </TR> <TR valign=top align=center> <TD colspan=2><B>Результаты расчетов</B></TD> </TR> <TR valign=top> <TD colspan=2> <TEXTAREA name=fres cols=70 rows=30 readonly> Отсутствует активация... </TEXTAREA> </TD>
33
</TR> </TABLE> </FORM> <SCRIPT language=JavaScript> var n, eznhdn, ezntp, ezntob, eznps, eznfl, eopods, eznods, eopmns, eznmns, eopodv, eznodv, eopmnv, eznmnv, vods, vmns, vodv, vmnv, opres, znres; // Расчет формы function rasf() { document.title = 'Программа 3: Результаты расчетов'; document.fnam.fres.value = "\tРасчет параметров"; znres = 0; opres = document.fnam.fres.value; // Обработка данных из скрытого элемента opres = opres+"\n\tРезультаты обработки скрытого элемента"; eznhdn = new String(document.fnam.hdn.value); opres = opres+"\n"+eznhdn+"."; // Обработка данных из текстового поля opres = opres+"\n\tРезультаты обработки текстового поля"; ezntp = parseInt(document.fnam.tp.value);
if (document.fnam.tp.value=="") { ezntp = 0; ezntp = "Информация в текстовом поле отсутствует";
} opres = opres+"\n"+ezntp+"."; znres = znres+ezntp; // Обработка данных из текстовой области opres = opres+"\n\tРезультаты обработки текстовой области"; ezntob = new String(document.fnam.tob.value);
if (document.fnam.tob.value=="")
{
ezntob = "Информация в текстовой области отсутствует";
} opres = opres+"\n"+ezntob+"."; // Обработка данных из поля пароля opres = opres+"\n\tРезультаты обработки поля пароля"; eznps = new String(document.fnam.ps.value);
if (document.fnam.ps.value=="")
{
eznps = "Информация в поле пароля отсутствует";
} opres = opres+"\n"+eznps+".";
// Обработка данных из загрузки файла
opres = opres+"\n\tРезультаты обработки загружамого файла"; eznfl = new String(document.fnam.fl.value);
if (document.fnam.fl.value=="")
{
eznfl = "Информация о загруженном файле отсутствует";
} opres = opres+"\n"+eznfl+"."; // Обработка данных из однозначного списка
34
vods = 0; eznods = 0; opres = opres+"\n\tРезультаты обработки однозначного списка"; for (n=1;n<document.fnam.ods.length;n++) { if (document.fnam.ods[n].selected) { vods++; eopods = new String(opods[n]); eznods = parseInt(znods[n]); opres = opres+"\n"+eopods+" - "+eznods+"."; znres = znres+eznods; } } if (vods==0) { opres = opres+"\nНе выделен элемент однозначного списка."; } // Обработка данных из множественного списка vmns = 0; opres = opres+"\n\tРезультаты обработки множественного списка"; imns = 0; iznmns = 0; eopmns = ""; for (n=0;n<document.fnam.mns.length;n++) { if (document.fnam.mns[n].selected) { vmns++; imns++; eopmns = new String(opmns[n]); eznmns = parseInt(znmns[n]); opres = opres+"\n"+imns+". "+eopmns+" - "+eznmns+"."; znres = znres+eznmns; iznmns = iznmns+eznmns; } } if (vmns==0) { opres = opres+"\nНе выделены элементы множественного списка."; } else { opres = opres+"\nИтого по множественному списку: "+iznmns+"."; } // Обработка данных из однозначного выбора vodv = 0; eznodv = 0; opres = opres+"\n\tРезультаты обработки однозначного выбора"; for (n=0;n<document.fnam.odv.length;n++) { if (document.fnam.odv[n].checked) {
35
vodv++; eopodv = new String(opodv[n]); eznodv = parseInt(znodv[n]); opres = opres+"\n"+eopodv+" - "+eznodv+"."; znres = znres+eznodv; } } if (vodv==0) { opres = opres+"\nНе выделен элемент однозначного выбора."; } // Обработка данных из множественного выбора vmnv = 0; opres = opres+"\n\tРезультаты обработки множественного выбора"; imnv = 0; iznmnv = 0; eopmnv = ""; for (n=0;n<document.fnam.mnv.length;n++) { if (document.fnam.mnv[n].checked) { vmnv++; imnv++; eopmnv = new String(opmnv[n]); eznmnv = parseInt(znmnv[n]); opres = opres+"\n"+imnv+". "+eopmnv+" - "+eznmnv+"."; znres = znres+eznmnv; iznmnv = iznmnv+eznmnv; } } if (vmnv==0) { opres = opres+"\nНе выделены элементы множественного выбора."; } else { opres = opres+"\nИтого по множественному выбору: "+iznmnv+"."; } opres = opres+"\nИтоговая сумма: "+ezntp+"+"+eznods+"+"+iznmns+ "+"+eznodv+"+"+iznmnv+" = "+znres+"."; document.fnam.fres.value = opres; document.fnam.tp.disabled = true; document.fnam.tob.disabled = true; document.fnam.ps.disabled = true; document.fnam.fl.disabled = true; document.fnam.ods.disabled = true; document.fnam.mns.disabled = true; document.fnam.odv.disabled = true; document.fnam.mnv.disabled = true; document.fnam.mnv.disabled = true; document.fnam.ras.disabled = true; document.fnam.del.disabled = false; for (n=0;n<document.fnam.ods.length;n++)
36
{ document.fnam.ods[n].disabled = true; } for (n=0;n<document.fnam.mns.length;n++) { document.fnam.mns[n].disabled = true; } for (n=0;n<document.fnam.odv.length;n++) { document.fnam.odv[n].disabled = true; } for (n=0;n<document.fnam.mnv.length;n++) { document.fnam.mnv[n].disabled = true; } } function delf() { document.title = 'Программа 3: Исходные данные'; document.fnam.tp.disabled = false; document.fnam.tob.disabled = false; document.fnam.ps.disabled = false; document.fnam.fl.disabled = false; document.fnam.ods.disabled = false; for (n=0;n<document.fnam.ods.length;n++) { document.fnam.ods[n].disabled = false; document.fnam.ods[n].selected = false; } document.fnam.mns.disabled = false; for (n=0;n<document.fnam.mns.length;n++) { document.fnam.mns[n].disabled = false; document.fnam.mns[n].selected = false; } for (n=0;n<document.fnam.odv.length;n++) { document.fnam.odv[n].disabled = false; document.fnam.odv[n].checked = false; } for (n=0;n<document.fnam.mnv.length;n++) { document.fnam.mnv[n].disabled = false; document.fnam.mnv[n].checked = false; } document.fnam.tp.value = "01";
document.fnam.tob.value = "Введите текст"; document.fnam.ps.value = "Введите пароль";
document.fnam.fl.value = ""; document.fnam.ras.disabled = false; document.fnam.del.disabled = true; document.fnam.fres.value = "\tОтсутствует активация..."; }
37
</SCRIPT> </BODY> </HTML>
2.4. Реализация расчетов при обработке форм статических Интернет­страниц с автоматизированной активацией элементов результатов
Программа предназначена для выполнения пользователем в рамках единой формы
статической Интернет-страницы операций по вводу числовых значений в предлагаемые текстовые поля с последующей автоматизированной обработки программой полученных
значений с целью принудительного указания значений результатов, представленных в виде
различных элементов данной формы. Обработка и обновление значений исходных данных осуществляется с использованием событий, заключающихся в нажатии соответствующих
кнопок активации действий, при этом элементы вывода информации представляются в виде различных элементов, для которых заблокированы операции по настройке значений в
пользовательском режиме.
Рис. 10. Указание значений исходных данных в единой форме
статической Интернет-странице
38
Рис. 11. Вывод результатов обработки формы в рамках единой
статической Интернет-страницы
Исходный код статической Интернет-сраницы представляется в следующем виде:
<HTML> <HEAD> <TITLE>Программа 4: Исходные данные</TITLE> <SCRIPT language=JavaScript> var n; opods = new Array(4);
39
opmns = new Array(4); opodv = new Array(3); opmnv = new Array(4);
// Однозначный список opods[0] = 'Не произведен расчет'; opods[1] = 'Вариант 11 (Элемент 1 > 0)'; opods[2] = 'Вариант 12 (Элемент 1 = 0)'; opods[3] = 'Вариант 13 (Элемент 1 < 0)'; // Множественный список opmns[0] = 'Вариант 21 (Элемент 1 > Элемент 2)'; opmns[1] = 'Вариант 22 (Элемент 3 > Элемент 2)'; opmns[2] = 'Вариант 23 (Элемент 1 < Элемент 2)'; opmns[3] = 'Вариант 24 (Элемент 3 > Элемент 1)'; // Однозначный выбор opodv[0] = 'Вариант 31 (Элемент 1 + Элемент 2 > 0)'; opodv[1] = 'Вариант 32 (Элемент 1 + Элемент 2 = 0)'; opodv[2] = 'Вариант 33 (Элемент 1 + Элемент 2 < 0)'; // Множественный выбор opmnv[0] = 'Вариант 41 (Элемент 1 * Элемент 2 > 0)'; opmnv[1] = 'Вариант 42 (Элемент 1 * Элемент 2 < 0)'; opmnv[2] = 'Вариант 43 (Элемент 1 * Элемент 3 > 0)'; opmnv[3] = 'Вариант 44 (Элемент 2 * Элемент 3 > 0)';
</SCRIPT> <FORM name=fnam method=post> <TABLE border=1 bordercolor=green cellspacing=0> <TR align=center> <TD colspan=2><B>Исходные данные</B></TD> </TR><TR valign=top> <TD>Скрытый элемент</TD> <TD><INPUT type=hidden name=hdn value="Программа 4"></INPUT></TD> </TR><TR valign=top> <TD>Элемент 1</TD> <TD><INPUT type=text name=tp1 value=1></INPUT></TD> </TR><TR valign=top> <TD>Элемент 2</TD> <TD><INPUT type=text name=tp2 value=2></INPUT></TD> </TR><TR valign=top> <TD>Элемент 3</TD> <TD><INPUT type=text name=tp3 value=3></INPUT></TD> </TR><TR valign=top> <TD>Загрузка файла</TD> <TD><INPUT type=file name=fl></INPUT></TD> </TR><TR align=center> <TD> <INPUT type=button name=ras value="Обработка" onClick="rasf();"> </INPUT> </TD> <TD> <INPUT type=reset name=del value="Отмена" onClick="delf();" disabled></INPUT> </TD> </TR><TR valign=top align=center> <TD colspan=2><B>Результаты обработки формы</B></TD>
40
</TR><TR valign=top>
<TD>Текстовое поле</TD> <TD><INPUT type=text name=tp value="Отсутствуют результаты"
disabled></INPUT></TD> </TR><TR valign=top>
<TD>Текстовая область</TD> <TD><TEXTAREA cols=40 rows=5 name=tob readonly>Отсутствуют результаты</TEXTAREA></TD>
</TR><TR valign=top> <TD>Поле пароля</TD> <TD><INPUT type=password name=ps value="Отсутствуют результаты" disabled></INPUT></TD> </TR><TR valign=top> <TD>Однозначный список</TD> <TD><SELECT name=ods disabled> <SCRIPT language=JavaScript> for (n=0;n<opods.length;n++) { document.writeln("<OPTION value="+n+">"+opods[n]+"</OPTION>"); } </SCRIPT> </SELECT> </TD> </TR><TR valign=top> <TD>Множественный список</TD> <TD> <SELECT name=mns multiple disabled> <SCRIPT language=JavaScript> for (n=0;n<opmns.length;n++) { document.writeln("<OPTION value="+n+">"+opmns[n]+"</OPTION>"); } </SCRIPT> </SELECT> </TD> </TR><TR valign=top> <TD>Однозначный выбор</TD> <TD> <SCRIPT language=JavaScript> for (n=0;n<opodv.length;n++) { document.writeln("<INPUT type=radio name=odv value="+n+" disabled>"+opodv[n]+"</INPUT><BR>"); } </SCRIPT> </TD></TR><TR valign=top> <TD>Множественный выбор</TD><TD> <SCRIPT language=JavaScript> for (n=0;n<opmnv.length;n++) { document.writeln("<INPUT type=checkbox name=mnv value="+n+" disabled>"+opmnv[n]+"</INPUT><BR>"); }
Соседние файлы в предмете [НЕСОРТИРОВАННОЕ]