Para criar um objeto dessa Classe use a tag SELECT definindo um NAME. Antes de fechar a tag temos que definir os itens, usando tags: OPTION. O evento onChange é um gatilho para uma função, por exemplo:"itemSelected()". Há uma propriedade que é um array de todos os itens - o nome é options. Para um item do array existem as propriedades: selected e text.
Veja um exemplo:
<html>
<head>
<script language="Javascript">
function init(){
}
function toBeUsed() {
for(i=0;i<document.form1.sl1.length;i++){
if(document.form1.sl1.options[i].selected){
document.form1.t1.value = document.form1.sl1.options[i].text;
}
}
}
</script>
</head>
<title>TUTCity</title>
<body bgcolor="yellow" onload=init()>
<form name="form1">
<select name="sl1" onChange="toBeUsed()">
<option>Pistol 38
<option>Machine gun
<option>Granade
</select>
<input type=text name="t1" size=20></form>
</body>
</html>
Veja o resultado, apresentado no simulador do micro OLPC.
A Classe tem três propriedades importantes:
length
Quantidade de itens.
selectedIndex
O indice - 1 do item selecionado.
options
Um array tendo todos os itens. Podemos usar:
options[i].selected
para capturar o item selecionado. Ou:
options[i].text
para capturar o texto do item.
LIÇÃO ANTERIOR PRÓXIMA LIÇÃO