Atascado con un select de un formulario
Estoy atascado con un problema con un select de un formulario
al pinchar en cualquier opción del select debe mostrar el value en una caja y una imagen en otra
He conseguido que si son 2 textos si los muestre en 2 cajas diferentes, pero al tratar de imágenes, o bien muestra el texto o la imagen
Este es el código que muestra las imágenes, en el text área donde muestra la url de la imagen debería mostrar el value del option
<! DOCTYPE html>
<html lang="es">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Cambio de imagen</title>
</head>
<body>
<form name="ddmessage">
<select name="selectbox" size="4" onChange="changecontent(this)">
<option value="Ain">Ain</option>
<option value="albocacer">Albocacer</option>
<option value="alcora">Alcora</option>
<option value="almassora">Almazora</option>
</select><br><br><br>
<textarea rows="8" name="contentbox" id="nivel" cols="35" wrap="virtual"></textarea><br>
</form>
<img name="imagen" src=""/>
<script language="JavaScript">
var thecontents=new Array()
thecontents[0]='escudos/ain.png'
thecontents[1]='escudos/albocacer.png'
thecontents[2]='escudos/alcora.png'
thecontents[3]='escudos/almassora.png'
function changecontent(which){
imagen.src = thecontents[document.ddmessage.selectbox.selectedIndex]
/*podes eliminar esta linea junto con el contentbox, es solo para mostrar el resultado*/
document.ddmessage.contentbox.value= thecontents[document.ddmessage.selectbox.selectedIndex]
}
</script>
</body>
</body>
</html>
Y este es donde me muestra los 2 value del option
<! DOCTYPE html>
<html lang="es">
<head>
<meta name="http-equiv" content="Content-type: text/html; charset=UTF-8"/>
</head>
<body>
<form id="poblaciones" name="poblaciones" >
<select size="5" onChange="document.getElementById('nivel').value = this.options[this.selectedIndex].value.split(',')[0];document.getElementById('nivel2').value = this.options[this.selectedIndex].value.split(',')[1]">
<option value="1,escudos/ain.png"> 1</option>
<option value="2,B"> 2</option>
<option value="3,C"> 3</option>
<option value="4,D"> 4</option>
<option value="5,E"> 5</option>
</select>
<input type="text" id="nivel" name="nivel">
<input type="text" id="nivel2" name="nivel2" style="width:300px;height:300px;">
</body>
</html>
De antemano agradezco la ayuda, porque no doy con la solución
Saludos y gracias