Мальчики, помогите, пожалуйста. Я совсем недавно начала изучать JavaScript и этот вопрос сама разрешить не в состоянии. Приведенный ниже код по разному отображается в Internet Explorer 7 и Mozilla Firefox 3.5. В Internet Explorer 7 появляется содержимое под связанными списками при клике по любой строчке в списке, а в Mozilla Firefox и Opera этого нет. Как решить эту проблему? Буду очень признательна.
<html><head><META http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
<!--
#description
{
positon:absolute;
top: 480;
left: 200;
z-index: 1;
background-color: transparent;
width: 700;
height: 200;
font-family:Verdana, Geneva, Arial, Helvetica, Sans Serif;
font-size:12px;
line-height:15px;
color: #000000;
visibility: visible;
}
//-->
</style>
<script language="JavaScript">
<!--
function Entry(ID, Name, DescriptionText, URL)
{
this.ID = ID;
this.Name = Name;
this.DescriptionText = DescriptionText;
this.URL = URL;
}
var MainCategory = new Array();
MainCategory[0] = new Entry("165","Корма для собак","Собачьи корма бывают сухие и консервированные. Сухой корм для собак представляет собой гранулы различной формы.");
var SubCategory165= new Array();
SubCategory165[0] = new Entry("165_10","Сухой корм","Сухие корма для собак хорошо хранятся, долго не портятся в открытом виде. Многие животные предпочитают именно их, несмотря на то, что по вкусовым качествам сухие корма для собак несколько уступают другим видам продуктов для животных. ");
SubCategory165[1] = new Entry("165_10","Консервированный","Консервированный корм для собак бывает обычным и деликатесным. Для повседневного рациона следует выбирать обычный корм для собаки. Он, как правило, включает в себя зерновые злаки, полезные для пищеварения животного, а также имеет оптимальную питательную ценность.");
var Naimenovanie165_10 = new Array();
Naimenovanie165_10[0] = new Entry("165_10_20","Ассорти №10 - мягкая упаковка","Описание: Набор-пробник, состоящий из изделий четырёх видов в каждом пакете.");
Naimenovanie165_10[1] = new Entry("165_10_21","Ассорти №5 - твердая упаковка","Описание: Набор-пробник, состоящий из изделий 8-12 видов в каждом пакете.");
function InitializeMainCategory(currentForm) {
for (var i=0; i < MainCategory.length; i++) {
eval(currentForm + ".MainCategory.options[i] = new Option('" + MainCategory[i].Name + "')");
eval(currentForm + ".MainCategory.options[i].value = " + MainCategory[i].ID);
}
}
function PopulatePane(currentPane, paneToPopulate) {
var selectedArray, i;
var selected = currentPane.options[currentPane.selectedIndex].value
if (selected == 0) {
// yeah, we should be able to just do the select set и index decrement no matter what,
// и then check for selected being undefined, but browser bugs make life more "fun" than that
if (currentPane.selectedIndex != 0)
selected = currentPane.options[--currentPane.selectedIndex].value;
else {
currentPane.selectedIndex = -1;
return false;
}
}
// try {
// eval(paneToPopulate + selected);
// } catch(e) {
// alert("There is no " + paneToPopulate + " associated with this " + currentPane.name);
// return;
// }
selectedArray = eval(paneToPopulate + selected);
paneToPopulate = eval("currentPane.form." + paneToPopulate)
// if we need to clear panes, we'll start clearing out options with the last pane и work back until we run out
for (i = currentPane.form.elements.length - 1; i > 0; i--) {
paneToClear = paneToPopulate.form.elements[i]
if (paneToClear == paneToPopulate) {
break;
}
// make sure we're only doing the clearing operation on panes we care about
if (paneToClear.name == "Naimenovanie" || paneToClear.name == "SubCategory" || paneToClear.name == "MainCategory") {
for (i = paneToClear.options.length; i != 0; i--) {
paneToClear.options[i - 1] = null;
}
}
}
while (selectedArray.length < paneToPopulate.options.length) {
paneToPopulate.options[(paneToPopulate.options.length - 1)] = null;
}
for (i = 0; i < selectedArray.length; i++) {
// alert("paneToPopulate.options[i] = new Option('" + selectedArray[i].Name + "')");
if ( selectedArray[i] == null || selectedArray[i] == "" ) {
alert("There is no " + paneToPopulate.Name + " associated with this " + currentPane.Name);
} else {
eval("paneToPopulate.options[i] = new Option('" + selectedArray[i].Name + "')");
eval("paneToPopulate.options[i].value = '" + selectedArray[i].ID + "'");
}
}
if (document.welcome.Naimenovanie.options[0] == null) {
document.welcome.Naimenovanie.options[0] = new Option("[Шаг 3] ");
document.welcome.Naimenovanie.options[0].value = 0;
}
}
function changePage(form) {
/*
deal with nasty sporadic back button bug in Netscape 4, where user can have only the last pane selected.
changing checkSelection() is a possibility, but if the user selects the third pane, и the other two are blank,
he should really still get the driver he asked for.
therefore, we need to extract the value of the second pane from the third
*/
if (form.Naimenovanie.selectedIndex != -1) {
PaneValues = form.Naimenovanie.options[form.Naimenovanie.selectedIndex].value.split("_");
SubCategoryValue = PaneValues[0] + "_" + PaneValues[1]
DriverValue = SubCategoryValue + "_" + PaneValues[2];
whichArray = eval("Naimenovanie" + PaneValues[0] + "_" + PaneValues[1]);
for (i = 0; i < whichArray.length; i++) {
if (whichArray[i].ID == DriverValue) {
form.action = "javascript:document.location.href = '" + strURLPrefix + whichArray[i].URL + "';";
break;
}
}
return true;
} else {
alert("Шаг 3?");
return false;
}
}
function changeTextBlock(whichPane) {
if (whichPane.selectedIndex == -1)
return false;
var newDescription;
switch (whichPane.name) {
case "MainCategory" :
newDescription = MainCategory[whichPane.selectedIndex].DescriptionText;
break;
case "SubCategory" :
newDescription = eval("SubCategory" + whichPane.form.MainCategory.options[whichPane.form.MainCategory.selectedIndex].value + "[" + whichPane.selectedIndex + "].DescriptionText");
break;
case "Naimenovanie" :
newDescription = eval("Naimenovanie" + whichPane.form.SubCategory.options[whichPane.form.SubCategory.selectedIndex].value + "[" + whichPane.selectedIndex + "].DescriptionText");
break;
}
if (NS4) {
eval(layerRef + '["description"].document.open()');
eval(layerRef + '["description"].document.write(newDescription)');
eval(layerRef + '["description"].document.close()');
} else if (NS6) {
eval(layerRef + '("description").innerHTML=newDescription');
} else {
eval(layerRef + '["description"].innerHTML=newDescription');
}
}
var bName = navigator.appName;
var bVer = parseInt(navigator.appVersion);
var NS4 = (bName == "Netscape" && bVer == 4);
var NS6 = (navigator.vendor == "Netscape6");
var IE4 = (bName == "Microsoft Internet Explorer" && bVer >= 4);
var Opera = (window.opera)
if (NS4) {
layerRef="document.layers";
styleSwitch="";
} else if (IE4) {
layerRef="document.all";
styleSwitch=".style";
} else if (NS6 || Opera) {
layerRef="document.getElementById";
styleSwitch=".style";
}
// -->
</script>
</head>
<BODY onLoad="InitializeMainCategory('document.welcome');">
<!-- DO NOT DELETE THE LINE ABOVE - IT LOADS THE DRIVER PANES -->
<TABLE cellSpacing=10 cellPadding=0 width=468 border=0>
<TBODY>
<DIV style="MARGIN-TOP: 10px; MARGIN-LEFT: 20px">
<FORM name=welcome onsubmit="return changePage(this);" method=get encType=text/plain><FONT class=iomainhead>Кликните: корма для собак</FONT>
<DIV style="FONT-SIZE: 11px; MARGIN-BOTTOM: 3px; FONT-FAMILY: arial"><SELECT style="FONT-SIZE: 11px; FONT-FAMILY: arial" onchange="PopulatePane(this, 'SubCategory'); changeTextBlock(this);" size=8 name=MainCategory> <OPTION value=0></OPTION></SELECT> <SELECT style="FONT-SIZE: 11px; FONT-FAMILY: arial" onchange="PopulatePane(this, 'Naimenovanie'); changeTextBlock(this);" size=8 name=SubCategory> <OPTION value=0>[Шаг 2];</OPTION></SELECT> <SELECT style="FONT-SIZE: 11px; FONT-FAMILY: arial" onchange="if (this.form.Naimenovanie.options[this.form.Naimenovanie.selectedIndex].value == 0) { this.form.Naimenovanie.selectedIndex -= 1 }; changeTextBlock(this);" size=8 name=Naimenovanie> <OPTION value=0>[Шаг 3];</OPTION></SELECT> </DIV></FORM>
<DIV id=description></DIV>
<SCRIPT language=JavaScript type=text/javascript>
document.welcome.MainCategory.selectedIndex = -1;
document.welcome.SubCategory.selectedIndex = -1;
document.welcome.Naimenovanie.selectedIndex = -1;
// Netscape 4's absolute positioning... isn't.
if (NS4) {
document.ids.description.left = parseInt(document.ids.description.left) + 19;
document.ids.description.top = parseInt(document.ids.description.top) + 12;
}
//-->
</SCRIPT>
</body></html>