Provate con explorer il seguente codice:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Documento senza titolo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="javascript" type="text/javascript">
function selezionaselect1(v) {
for (var i=0; i<document.form1.id_select1.length; i++) {
value=document.form1.id_select1.options[i].value;
text=document.form1.id_select1.options[i].text;
if (value==document.form1.id_select2.value) {
document.getElementById('id_select1').options[i].selected=true;
}
}
}
function selezionaselect2(v) {
for (var i=0; i<document.form1.id_select2.length; i++) {
value=document.form1.id_select2.options[i].value;
text=document.form1.id_select2.options[i].text;
if (value==document.form1.id_select1.value) {
document.getElementById('id_select2').options[i].selected=true;
}
}
}
</script>
</head>
<body>
<form name='form1' method='post' action=''>
<table width='600' border='1' align='center'>
<tr>
<td align='center'>
<select id='id_select1' name='select1' size='5' style='width:100px;' onChange='selezionaselect2();'>
<option value='1'>uno</option>
<option value='6'>sei</option>
<option value='7'>sette</option>
<option value='8'>otto</option>
<option value='9'>nove</option>
<option value='10'>dieci</option>
<option value='11'>undici</option>
<option value='12'>dodici</option>
<option value='13'>tredici</option>
<option value='14'>quattordici</option>
<option value='15'>quindici</option>
<option value='16'>sedici</option>
<option value='17'>diciassette</option>
<option value='18'>diciotto</option>
</select></td>
<td align='center'></td>
<td align='center'>
<select id='id_select2' name='select2' style='width:100px;' size='5' onChange='selezionaselect1();'>
<option value='18'>diciotto</option>
<option value='17'>diciassette</option>
<option value='16'>sedici</option>
<option value='15'>quindici</option>
<option value='10'>dieci</option>
<option value='9'>nove</option>
<option value='8'>otto</option>
<option value='7'>sette</option>
<option value='6'>sei</option>
<option value='5'>cinque</option>
<option value='4'>quattro</option>
<option value='3'>tre</option>
<option value='2'>due</option>
<option value='1'>uno</option>
</select></td>
</tr>
</table>
</form>
</body>
</html>
Ho in pratica due select, cliccando ognuna delle quali, se esiste il valore corrispondente nell'altra select, lo seleziona. Nella fattispecie sopra riportata tutto sembra funzionare infatti anche se seleziono diciotto nella select di destra, mi scorre la sinistra fino a visualizzare e selezionare il diciotto.
Ho però un codice molto più complicato da riportare nel quale, in alcuni casi cliccando su una select mi seleziona (perchè se scorro manualmente è evidenziata) ma non mi fà scorrere la lista fino a visualizzarla selezionata.
Sapete spiegarvi il perchè? quale potrebbe essere il problema? o in ogni caso, come si fà a ordinargli di scorrere la select senza sperare che lo faccia da sola?![]()