Problema con JAVASCRIPT / Combobox

[Hs_Jeldres]

Hola Maestros deL Web, estoy comensando con Java Script y tengo 2 preguntas,

Código Javascript:

<script language="javascript">
function cambiar()
    {
        if((parseInt(document.getElementById('r1').value)>=0) && (parseInt(document.getElementById('r1').value)<=10))
        {
        document.getElementById("r1").className ="foto1";
        }
        else if((parseInt(document.getElementById('r1').value)>=11) && (parseInt(document.getElementById('r1').value)<=20))
        {
            document.getElementById("r1").className ="foto2";
        }
        else if(parseInt(document.getElementById('r1').value)>=21)
        {
        document.getElementById("r1").className ="foto3";
        }
    }
</script>
 

este codigo lo llamo desde un <Input de texto>

en el evento onclick osea debo clickear para que me cambie la imagen despues de obtenido el resultado.

esto lo hace desde el css.

Código CSS:

/* CSS Document */
.foto1 {
size:10;
background-image:url(aprobacion.jpg);
background-repeat:no-repeat;
}
.foto2 {
size:10;
background-image:url(nocumplio.jpg);
background-repeat:no-repeat;
}
.foto3 {
size:10;
background-image:url(exclamacion.jpg);
background-repeat:no-repeat;
}
 

Dejo tambien el codigo del <input>

Código HTML:

<input type=text name=r_pas size="10"   onClick="cambiar()" maxlength="16"  id="r1" value="    <?php MiconsultaPHP
?>">
 

necesito que asigne la imagen sin tener que clickear y ademasvalidar un combobox con Java script que deje la seleccion de una opcion que no sea vacio obligatorio,

desde ya muchas gracias.