Добавил:
ivanov666
Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз:
Предмет:
Файл:Web-программирование. Интерактивность статических Интернет-сайтов с применением форм. Учебное пособие для СПО
.pdf
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>");
}
Соседние файлы в предмете [НЕСОРТИРОВАННОЕ]
