Explication détaillée de l'implémentation par JavaScript de la fonction de téléchargement de fichiers asynchrone-js tutoriel-php.cn

Explication détaillée de l'implémentation par JavaScript de la fonction de téléchargement de fichiers asynchrone

小云云

Libérer： 2018-01-02 16:10:08

original

1496 Les gens l'ont consulté

Cet article vous apporte principalement un exemple de mise en œuvre du téléchargement de fichiers asynchrone à l'aide de JavaScript natif. L'éditeur le trouve plutôt bon, je vais donc le partager avec vous maintenant et le donner comme référence pour tout le monde. Suivons l'éditeur et jetons un œil. J'espère que cela pourra aider tout le monde.

Rendu :

Code : (demo33.jsp)

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
 <title>demo33.jsp</title>
</head>
<body>
<label for="text">名称</label>
<input type="text" id="text" name="name"/>
<label for="file">文件</label>
<input type="file" id="file" name="file"/>
<button type="button" onclick="ajaxUploadFile()">确定</button>
</body>
<script type="text/javascript">
 function ajaxUploadFile() {
  var formData = new FormData();
  var xmlhttp;
  if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
   xmlhttp = new XMLHttpRequest();
  }else {// code for IE6, IE5
   xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.open("POST","/data",true);
  xmlhttp.setRequestHeader("X-Requested-With", "XMLHttpRequest");
  formData.append("name",document.getElementById("text").value);
  formData.append("file",document.getElementById("file").files[0]);
  xmlhttp.send(formData);
  xmlhttp.onreadystatechange=function() {
   if (xmlhttp.readyState==4) {
    if (xmlhttp.status==200) {
     console.log("上传成功"+xmlhttp.responseText);
    }else {
     console.log("上传失败"+xmlhttp.responseText);
    }
   }
  }
 }
</script>
</html>

Copier après la connexion

Recommandations associées :

Explication détaillée du téléchargement de formulaire pour implémenter le téléchargement de fichiers asynchrone avec ajax

Js natif à implémenter Méthode de téléchargement de fichiers asynchrone

Méthode JavaScript pour implémenter le téléchargement de fichiers asynchrone

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!