versiones - Entrada HTML="archivo" Aceptar el tipo de archivo de atributo(CSV)




versiones de qgis (6)

Esperaba que alguien me ayudara.

Tengo un objeto de carga de archivos en mi página:

<input type="file" ID="fileSelect" />

Con los siguientes archivos de Excel en mi escritorio:

  1. file1.xlsx
  2. file1.xls
  3. archivo.csv

Quiero que la carga del archivo SÓLO muestre archivos .xlsx , .xls y .csv .

Usando el atributo de accept , encontré que estos tipos de contenido se encargaban de las extensiones .xlsx y .xls ...

accept = application / vnd.openxmlformats-officedocument.spreadsheetml.sheet (.XLSX)

accept = application / vnd.ms-excel (.XLS)

Sin embargo, no puedo encontrar el tipo de contenido correcto para un archivo CSV de Excel. ¿Alguna sugerencia?

EJEMPLO: http://jsfiddle.net/LzLcZ/


Ahora puede usar el nuevo pattern=".+\.(xlsx|xls|csv)" atributo de validación de entrada html5 pattern=".+\.(xlsx|xls|csv)" .


Bueno, esto es vergonzoso ... Encontré la solución que estaba buscando y no podría ser más simple. Usé el siguiente código para obtener el resultado deseado. Espero que esto ayude a alguien en el futuro. Gracias a todos por su ayuda.

<input id="fileSelect" type="file" accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" />  

Tipos de aceptación válidos:

Para archivos CSV (.csv), use:

<input type="file" accept=".csv" />

Para los archivos de Excel 97-2003 (.xls), use:

<input type="file" accept="application/vnd.ms-excel" />

Para los archivos de Excel 2007+ (.xlsx), use:

<input type="file" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" />

Para archivos de texto (.txt) use:

<input type="file" accept="text/plain" />

Para archivos de imagen (.png / .jpg / etc), use:

<input type="file" accept="image/*" />

Para archivos HTML (.htm, .html), use:

<input type="file" accept="text/html" />

Para archivos de video (.avi, .mpg, .mpeg, .mp4), use:

<input type="file" accept="video/*" />

Para archivos de audio (.mp3, .wav, etc.), use:

<input type="file" accept="audio/*" />

Para archivos PDF , use:

<input type="file" accept=".pdf" /> 

MANIFESTACIÓN:
http://jsfiddle.net/dirtyd77/LzLcZ/144/

NOTA:

Si está intentando mostrar archivos CSV de Excel ( .csv ), NO use:

  • text/csv
  • application/csv
  • text/comma-separated-values ( funciona solo en Opera ).

Si está intentando mostrar un tipo de archivo en particular (por ejemplo, un WAV o PDF ), esto casi siempre funcionará ...

 <input type="file" accept=".FILETYPE" />

Esto no me funcionó bajo Safari 10:

<input type="file" accept=".csv" />

Tuve que escribir esto en su lugar:

<input type="file" accept="text/csv" />

Estos días solo puedes usar la extensión de archivo

<input type="file" ID="fileSelect" accept=".xlsx, .xls, .csv"/>

He usado text/comma-separated-values por comas para CSV mime-type en el atributo de aceptación y funciona bien en Opera. Intenté text/csv sin suerte.

Algunos otros tipos MIME para CSV si los sugeridos no funcionan:

  • texto / valores separados por comas
  • texto / csv
  • aplicacion / csv
  • aplicación / excel
  • aplicacion / vnd.ms-excel
  • aplicación / vnd.msexcel
  • texto / cualquier texto

Fuente: http://filext.com/file-extension/CSV


Puede conocer el tipo de contenido correcto para cualquier archivo simplemente haciendo lo siguiente:

1) Seleccione el archivo interesado,

2) Y ejecutar en consola esto:

console.log($('.file-input')[0].files[0].type);

También puede configurar el atributo "múltiple" para que su entrada compruebe el tipo de contenido de varios archivos a la vez y haga lo siguiente:

for (var i = 0; i < $('.file-input')[0].files.length; i++){
    console.log($('.file-input')[0].files[i].type);
}

La aceptación de atributos tiene algunos problemas con varios atributos y no funciona correctamente en este caso.





content-type