Фильтрация эллементов через select
Доброго времени суток! Надо сделать чтобы было несколько эллементов разных цветов и при выборе цвета во втором уровне select, показывались только эллементы этого цвета. Есть один код (фильтрация через 2й select) :help: :cray: :help:
<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT LANGUAGE='JavaScript'>
var isPreNN6 = (navigator.appName == 'Netscape' && parseInt(navigator.appVersion) <= 4)
plainList = new Array(6)
hardList = new Array(6)
plainList[0] = 'cyan'
hardList[0] = 'red'
plainList[1] = 'magenta'
hardList[1] = 'purple'
plainList[2] = 'yellow'
hardList[2] = 'blue'
plainList[3] = 'lightgoldenrodyellow'
hardList[3] = 'black'
plainList[4] = 'salmon'
hardList[4] = 'white'
plainList[5] = 'dodgerblue'
hardList[5] = 'green'
function setLang(which) {
var listObj = document.forms[0].colors
if (listObj.type) {
var listLength = listObj.length
var currSelected = listObj.selectedIndex
for (var i = 0; i < listLength; i++) {
if (which == 'plain') {
listObj.options[i].text = plainList[i]
} else {
listObj.options[i].text = hardList[i]
}
}
if (isPreNN6) {
history.go(0)
} else {
listObj.selectedIndex = currSelected
}
}
}
</SCRIPT>
</HEAD>
<BODY>
<FORM>
<select onChange='setLang(this.value)' >
<option id='o1' value='plain' >Цвета 1</option>
<option id='o2' value='hard' >Цвета 2</option>
</select>
<SELECT NAME='colors'>
<OPTION SELECTED>cyan
<OPTION>magenta
<OPTION>yellow
</SELECT>
</FORM>
<BR />
<DIV STYLE="COLOR: YELLOW; WIDTH: 100PX; HEIGHT: 100PX;"></DIV>
<DIV STYLE="COLOR: MAGENTA; WIDTH: 100PX; HEIGHT: 100PX;"></DIV>
<DIV STYLE="COLOR: RED; WIDTH: 100PX; HEIGHT: 100PX;"></DIV>
<DIV STYLE="COLOR: GREEN; WIDTH: 100PX; HEIGHT: 100PX;"></DIV>
<DIV STYLE="COLOR: GRAY; WIDTH: 100PX; HEIGHT: 100PX;"></DIV>
<DIV STYLE="COLOR: PURPLE; WIDTH: 100PX; HEIGHT: 100PX;"></DIV>
<DIV STYLE="COLOR: SYAN; WIDTH: 100PX; HEIGHT: 100PX;"></DIV>
<DIV STYLE="COLOR: GREEN; WIDTH: 100PX; HEIGHT: 100PX;"></DIV>
<DIV STYLE="COLOR: GREEN; WIDTH: 100PX; HEIGHT: 100PX;"></DIV>
<DIV STYLE="COLOR: RED; WIDTH: 100PX; HEIGHT: 100PX;"></DIV>
<DIV STYLE="COLOR: GRAY; WIDTH: 100PX; HEIGHT: 100PX;"></DIV>
<DIV STYLE="COLOR: PURPLE; WIDTH: 100PX; HEIGHT: 100PX;"></DIV>
<DIV STYLE="COLOR: ; WIDTH: 100PX; HEIGHT: 100PX;"></DIV>
</BODY>
</HTML>
|