Perl CGI & JavaScript | Выберите опцию проблемы

1

Мне сложно провести время, чтобы понять, почему следующий код не работает:

test.cgi:

#!/usr/bin/perl -w

use CGI;

$cgi = new CGI;
$cgi->autoEscape(undef);
        %ptype = ("0","","1","Pennsylvania","2","New York","3","Ohio");
print   $cgi->header('text/html'),
        $cgi->start_html(-title=>'Test',-script=>[{-type=>'javascript',-src =>'/scripts/test.js'}]),
        $cgi->start_form(-method=>'GET',id=>'frmMain',-name=>'frmMain',-enctype=>'multipart/form-data'),
        $cgi->popup_menu(-style=>'width:200',name=>'ProblemType',-values=>\%ptype,-onChange=>'PopulateSType()',-default=>'0'),
        $cgi->popup_menu(-style=>'width:200',name=>'SubProblemType',-values=>''),
        $cgi->end_form,
        $cgi->end_html();

test.js:

function PopulateSType() {

   var ProblemList = document.frmMain.ProblemType;
   ClearOptions(document.frmMain.SubProblemType);

   if (ProblemList[ProblemType.selectedIndex].value == "1") {
      AddToOptionList(document.frmMain.SubProblemType, "0", "");
      AddToOptionList(document.frmMain.SubProblemType, "1", "Pittsburgh");
      AddToOptionList(document.frmMain.SubProblemType, "2", "Philadelphia");
      AddToOptionList(document.frmMain.SubProblemType, "3", "Harrisburg");
   }
   if (ProblemList[ProblemType.selectedIndex].value == "2") {
      AddToOptionList(document.frmMain.SubProblemType, "0", "");
      AddToOptionList(document.frmMain.SubProblemType, "1", "New York");
      AddToOptionList(document.frmMain.SubProblemType, "2", "Buffalo");
      AddToOptionList(document.frmMain.SubProblemType, "3", "Middletown");
   }
   if (ProblemList[ProblemType.selectedIndex].value == "3") {
      AddToOptionList(document.frmMain.SubProblemType, "1", "Cleveland");
      AddToOptionList(document.frmMain.SubProblemType, "2", "Cincinatti");
      AddToOptionList(document.frmMain.SubProblemType, "3", "Akron");
   }
}

function ClearOptions(OptionList) {
   for (x = OptionList.length; x >= 0; x = x - 1) {
      OptionList[x] = null;
   }
}

function AddToOptionList(OptionList, OptionValue, OptionText) {
   OptionList[OptionList.length] = new Option(OptionText, OptionValue);
}

Пример источника вывода:

<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US" xml:lang="en-US"><head><title>Process Alarm</title>
<script language="JavaScript" src="/scripts/test.js" type="javascript"></script>
</head><body><form method="get" action="/cgi-bin/test.cgi/test.cgi?null" enctype="multipart/form-data" name="frmMain" id="frmMain">
<select name="ProblemType" onchange="PopulateSType()" style="width:200">
<option value="1">Pennsylvania</option>
<option value="3">Ohio</option>
<option selected="selected" value="0"></option>
<option value="2">New York</option>
</select><select name="SubProblemType" style="width:200">
<option value=""></option>

</select></form></body></html>

Все выглядит так, как будто он должен работать, но при загрузке страницы ничего не происходит со второй кнопкой выбора. Кажется, что поражение или промах, если стиль ширины применяется, когда страница загружается. Я даже попробовал window.onload = load; в верхней части test.js. Единственное, что я вижу, что может быть ошибкой, - это perl форматирование onChange как onchange.

java отлично работает в обычном HTML, у него просто возникают проблемы при попытке реализовать это в perl. Я использую пример из здесь

  • 0
    Вы говорите, что ничего не происходит со второй кнопкой выбора. я не вижу здесь никаких кнопок. Кроме того, что должно произойти вместо ничего?
  • 0
    На странице появятся 2 группы выбора (извините, я сказал кнопку, но это выбор, о котором я говорю). На основании того, что вы выбрали в первом Select, будет определяться, как будет заполняться второй. petenelson.com/aspwatch/Option%20List%20Examples.htm Приведенная выше ссылка - это сайт, на котором я нашел javascript, и демонстрирует, чего я пытаюсь достичь.
Теги:
cgi

1 ответ

1
Лучший ответ
<script language="JavaScript" src="/scripts/test.js" type="javascript">

Это должен быть type="text/javascript", тип MIME-носителя для JS, поддерживаемый браузерами. type="javascript" сам по себе не будет распознан. (language="javascript" устарело.)

style="width:200"

должен быть 200px.

for (x = OptionList.length; x >= 0; x = x - 1) {
   OptionList[x] = null;
}

Не уверен, что null будет работать. Традиционная быстрая идиома:

OptionList.length= 0;
  • 0
    Изменение следующей строки: $ cgi-> start_html (-title => 'Test', - script => [{- type => 'text / javascript', - src => '/ scripts / test.js'}]) ; Выходные данные: <script language = "JavaScript" src = "/ scripts / test.js" type = "text / javascript"> </ script> Второй параметр выбора по-прежнему не заполняется. добавление px исправило проблему с размерами :)
  • 0
    Все еще ничего после OptionList.length = 0;
Показать ещё 3 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню