Hola:
Me piqué con este tema e hice esto:
Código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>
http://www.caricatos.net/probador
</title>
<script>
function tag(id) {return document.getElementById(id)};
var actual = total = 0;
var maximo = 5;
function listar(f) {
if (actual == total) {
actual = ++total;
nuevo = document.createElement("div");
nuevo.onclick = function() {
tag("file_" + actual).style.display = "none";
actual = this.id.substr(9);
tag("file_" + actual).style.display = "inline";
}
nuevo.id = "elemento_" + (actual - 1);
tag("listado").appendChild(nuevo);
nuevo.appendChild(document.createTextNode(f.value));
if (total < maximo) {
nuevof = f.cloneNode(true);
f.style.display = "none";
nuevof['value'] = "";
nuevof.id = "file_" + actual;
f.parentNode.insertBefore(nuevof, f.nextSibling);
}
else {
tag("oculto").style.display = "none";
actual = 4;
}
}
else {
// tag("listado").replaceNode(tag("elemento_" + actual).firstChild, document.createTextNode(f.value));
tag("elemento_" + actual).innerHTML = f.value;
}
}
</script>
</head>
<body>
<form action="javascript: alert('Ok')" >
<input type="file" onchange="listar(this)" name="userfile[]" id="file_0" size="50" />
<button type="submit"> enviar </button>
</form>
<div id="listado" style="position: relative">
<div id="oculto" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent"></div>
</div>
</body>
</html>
Hay cosas para mejorar, pero en FF funciona.
Saludos
