Cita:
Iniciado por jonasmz 
Código HTML:
<html>
<body>
<form>
<input type="file" id="i1" class="upfil" /><br /><br />
<input type="file" id="i2" class="upfil" /><br /><br />
<input type="file" id="i3" /><br /><br />
<input type="file" id="i4" /><br /><br />
<input type="file" id="i5" class="upfil" /><br /><br />
<input type="file" id="i6" /><br /><br />
<input type="file" id="i7" class="upfil" /><br /><br />
<input type="file" id="i8" class="upfil" /><br /><br />
<a href="#" onClick="seleccionar()">probar funcion</a>
</form>
<script type="text/javascript">
function seleccionar()
{
//selecciono todos los 'inputs'
var allinputs = document.getElementsByTagName("input");
//creo un array para almacenar solo los inputs que voy a utilizar
var inputs = new Array(); var j = 0; //La variable 'j' la utilizo como apuntador en el array 'input'
//recorro todos los inputs recogidos
for(i=0; i<allinputs.length; i++)
{
//extraigo los inputs con la clase especifica para subir archivos
if (allinputs[i].className == "upfil")
{
//aca realizo el paso de los inputs(si el input tiene una clase 'upfil' entonces los aparto en un array en limpio)
inputs[j] = allinputs[i];
j++; //incremento el apuntador para el proximo input a almacenar
}
}
comprobacion(inputs); //llamada a la funcion que comprueba los inputs en cuestion
}
function comprobacion(iarray)
{
for(m=0; m < iarray.length; m++) //recorro el array con los inputs
{
var cadena1 = iarray[m].value; //tomo el valor del primer input
var s = cadena1.lastIndexOf("."); //obtengo la posision del ultimo punto en la cadena(el que precede a la extencion)
var miarr = new Array("gif","png","jpeg","jpg"); //Declaro un array con las extensiones permitidas
for (i = 0; i < miarr.length; i++) //bucle en el que compruebo las extensiones permitidas
{
var charfind = cadena1.substr(s+1,4); //extraigo las ultimas 4 letras despues del punto (posision 's+1')
charfind = charfind.toLowerCase(); //convierto la extraccion a minisculas para evitar comprobaciones erroneas
if(charfind == miarr[i]) //compruebo la extencion obtenida con las permitidas
{
alert("Archivo "+(m+1)+" validado"); //si es correcta aviso que esta validado
iarray[m].style.border = 'inherit'; //limpio bordes por si es la segunda ejecucion
iarray[m].style.color = 'black'; //limpio el color de letra por si es la segunda ejecucion
break; //termino blucle
}
if(i == miarr.length - 1) //si se ha llegado a la ultima pasada en el bucle aviso que se ha introducido una extension erronea
{
iarray[m].style.border = '4px red solid'; //remarco el borde del elemento mal
iarray[m].style.color = 'red'; //remarco fuente del elemento malo
alert("Has introducido una extension erronea en archivo " + (m+1)); //envio alerta
}
}
}
}
</script>
</body>
</html> Con esto lo unico que te queda por hacer es buscar la manera de agregar la clase a los inputs para que te valide la funcion. Fijate si te sirve, si no vemos alguna otra alternativa que podria ser con jquery.
Hola,
si te fijas mi código funciona de una forma diferente. Tal y como yo lo estaba haciendo la función de comprobar la asignaba al onChange() del input, de forma que el mensaje de formato inválido saltaba en cuanto se selecciona un elemento distinto a una imagen el input.
El código que tú has hecho lo que hace es comprobar todos los input una vez que están cargados y le das al link "probar función".
Lo que estoy tratando de hacer es lo que he dicho antes, que valide en cuanto se carga el input y que no lo haga solo con el primero sino con todos, el problema viene que se crean en tiempo de ejecución y no de compilación, entonces no se como podría validarlos de esa forma....