Primeiramente, gostaria de afirmar que isso é uma encapsulação secundária do controle de upload open source do WebUploader, e a camada subjacente ainda é implementada pelo WebUploader, só para usá-la de forma mais concisa.
Vamos dar uma olhada no WebUploader
Introdução:
WebUploader é um componente moderno simples de upload de arquivos baseado em HTML5, desenvolvido pela equipe Baidu WebFE (FEX). Nos navegadores modernos, ele pode aproveitar ao máximo as vantagens do HTML5, sem abandonar o navegador IE convencional, usando o tempo de execução original do FLASH, compatível com IE6+, iOS 6+ e Android 4+. O mesmo método de chamada pode ser usado pelos usuários a qualquer momento quando os dois conjuntos de runtimes estiverem disponíveis.
O uso de grandes fragmentos de arquivo e upload concorrente melhora muito a eficiência do upload de arquivos.
Endereço do site oficial: http://fex.baidu.com/webuploader/
Se você tem interesse em jogar sozinho, pode ir direto ao site oficial
Vamos começar o texto:
Pelo que foi dito acima, podemos ver que a função WebUploader da Baidu é realmente muito poderosa, mas, como todos os controles de upload, é mais trabalhosa de usar, como segue:
Você precisa consultar várias bibliotecas relacionadas primeiro,
Depois, escreva bem o HTML
Não queremos tudo isso!, só duas frases, receba nosso upload. Conforme segue:
Escrevi que o estilo bootstrap do CSS automaticamente referencia,
Suporta múltiplos uploads de arquivos,
Identificar automaticamente arquivos duplicados,
Upload automático opcional e upload manual,
Você pode renderizar múltiplos controles de upload em uma página sem conflito
Depois, alguns parâmetros de configuração relacionados ao WebUploader podem ser configurados por você mesmo.
Vamos direto ao widget JS que eu embalei (um pouco bagunçado, vamos nos virar):
Alguns parâmetros relacionados e mais importantes foram escritos com anotações, e você pode consultá-los por conta própria.
Então vamos usá-lo.
Escreva nosso JS e HTML da seguinte forma:
Tudo bem, vale destacar
Para os parâmetros no powerWebUpload, consulte a API no site oficial
O método GetFilesAddress() retorna um array de caminhos de arquivo após o upload, e você pode obter por conta própria.
Por fim, a última demo que escrevi, implementada usando Asp.net MVC, você pode baixá-la você mesmo:
Baidu Netdisk:
Link: http://pan.baidu.com/s/1o8B0xOQ Senha: 9kws
Original: http://www.cnblogs.com/GuZhenYin/p/5584272.html
|
Publicado em 27/06/2016 15:13:30
|
|
|
|
Publicado em 04/05/2020 21:03:04