Maison  >  Article  >  interface Web  >  Comment utiliser fileinput pour implémenter le téléchargement asynchrone ajax

Comment utiliser fileinput pour implémenter le téléchargement asynchrone ajax

php中世界最好的语言
php中世界最好的语言original
2018-04-02 09:50:293351parcourir

Cette fois, je vais vous montrer comment utiliser fileinput pour implémenter le téléchargement ajax asynchrone. Quelles sont les précautions pour utiliser fileinput pour implémenter le téléchargement ajax asynchrone, jetons un coup d'œil.

Vous devez d'abord importer des fichiers js et css

<link href="PUBLIC/CSS/bootstrap.css" rel="external nofollow" rel="stylesheet">
<link type="text/css" rel="stylesheet" href="PUBLIC/CSS/fileinput.css" rel="external nofollow" />
 <script type="text/javascript" src="PUBLIC/JS/bootstrap.min.js"></script>
<script type="text/javascript" src="PUBLIC/JS/jquery.min.js"></script>
<script type="text/javascript" src="PUBLIC/JS/fileinput.js"></script>
<script type="text/javascript" src="PUBLIC/JS/fileinput_locale_zh.js"></script>//中文包,不需要可以不用导入

code html

<form enctype="multipart/form-data">
  <input id="file-1" name="file" type="file" multiple class="file" data-overwrite-initial="false" data-min-file-count="1"/>
</form>

code js

$("#file-1").fileinput({
  uploadUrl: '', // 必须设置个路径进入php代码部分
  allowedFileExtensions : ['jpg', 'png','gif','txt','zip','ico','jpeg','js','css','java','mp3','mp4','doc','docx'],//允许的文件类型
  overwriteInitial: false,
  maxFileSize: 1500,//文件的最大大小 单位是k
  maxFilesNum: 10,//最多文件数量 
  // allowedFileTypes: ['image', 'video', 'flash'],
  slugCallback: function(filename) {
    return filename;
  }
});

code php

$file=$_FILES['file'];//获取上称文件的信息,数组形式
$date['file_name'] = $file['name'];//文件的名称
$date['file_size'] = $file['size'];//文件的大小
$date['file_type'] = $file['type'];//文件的类型

Ensuite, téléchargez, utilisez ajax pour renvoyer un message d'erreur ou un message de réussite

ou utilisez simplement echo pour le renvoyer directement.

Style :

Je crois que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour plus de passionnant. choses, veuillez faire attention à php chinois Autres articles connexes en ligne !

Lecture recommandée :

jQuery+Ajax détermine si le code de vérification saisi est réussi

Comment attribuer les balises renvoyées par Ajax Ajouter dynamiquement des styles

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn