Partage d'exemple de téléchargement asynchrone de fichier de formulaire Struts1 et jquery-js tutoriel-php.cn

Partage d'exemple de téléchargement asynchrone de fichier de formulaire Struts1 et jquery

小云云

Libérer： 2018-01-10 13:38:16

original

1526 Les gens l'ont consulté

Cet article vous apporte principalement une brève discussion sur le téléchargement asynchrone de fichiers de formulaire struts1 et jquery. L'éditeur pense que c'est plutôt bien, alors je vais le partager avec vous maintenant et le donner comme référence. Suivons l'éditeur pour y jeter un œil, j'espère que cela pourra aider tout le monde.

1. Présentation

Vous utilisez toujours les entretoises1 ? Oui, dans des endroits non écrits sur la terre, des méthodes de production rétrospectives sont toujours en cours d'exécution (anciens projets

Hérité de org.apache.struts.action.Action, hérité de org.apache.struts.action.ActionForm Let's). commencer

2. Code

2.1 page html

<html>
<head>
<title>网页上传</title>
</head>
<body>
  <center>
    <h1>本地文件网页上传</h1>
    <hr>

  </center>

  <h1>文件信息列表</h1>
  <hr>
  <form id="myform" method="post" enctype="multipart/form-data">
    <table width="0" border="0" cellspacing="10" cellpadding="0">
    
      <tr>
        <td>选择文件：</td>
        <td><input type="file" name="uploadFile" /></td>
      </tr>
      <tr>
        <td>标题：</td>
        <td><input type="text" name="filetitle" /></td>
      </tr>

      <tr>
        <td colspan="2">
          <input type="button" id="mysubmit" value="确认上传"/>
        </td>
      </tr>

    </table>
  </form>
  <script src="script/jquery.js"></script>
  <script src="script/jquery.form.js"></script>
  <script src="script/_fileUpload.js"></script>
</body>
</html>

Copier après la connexion

2.2 _fileUpload.js

/**
 *_fileUpload.js 
 *
 * 
 */
window.onload = function() {
  
  
  $("#mysubmit").bind("click", function(){
    $("#myform").ajaxSubmit({
      url: "myUpload.do",
      type: "post",
      success: function(data){
        console.log(11111111);
        console.log(data);
      },
      error: function(responseError){
        console.log(22222222222);
        console.log(responseError);
      }
      
    });
  });
}

Copier après la connexion

2.3 MyUploadAction.java (hérité d'Action )

package com.rocky.console.action;

import java.io.File;
import java.io.FileOutputStream;
import java.io.InputStream;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.apache.struts.action.Action;
import org.apache.struts.action.ActionForm;
import org.apache.struts.action.ActionForward;
import org.apache.struts.action.ActionMapping;
import org.apache.struts.upload.FormFile;

import com.rocky.console.form.MyUploadForm;
import com.rocky.console.service.ResponseUtil;


public class MyUploadAction extends Action {

  
  public ActionForward execute(ActionMapping mapping, ActionForm form, HttpServletRequest request,
      HttpServletResponse response) throws Exception{
    
    MyUploadForm myUploadForm = (MyUploadForm) form;
    FormFile uploadFile = myUploadForm.getUploadFile();
    String filetitle = myUploadForm.getFiletitle();
    System.out.println("111111"+filetitle);
    
    int fileSize = uploadFile.getFileSize();
    InputStream inputStream = uploadFile.getInputStream();
    System.out.println("fileSize::::::::"+fileSize);
    String path = "x:";
    String filename = path + File.separator + uploadFile.getFileName();
    FileOutputStream fos = new FileOutputStream(filename);
    byte[] b = new byte[1024];
    int len = -1;
    while((len = inputStream.read(b))!=-1){
      fos.write(b, 0, len);
    }
    fos.close();
    String result = "success";
    ResponseUtil.write(response, result, null);
    return null;
    
  }
}

Copier après la connexion

2.4 MyUploadForm.java (hérité d'ActionForm)

package com.rocky.console.form;

import javax.servlet.http.HttpServletRequest;

import org.apache.struts.action.ActionErrors;
import org.apache.struts.action.ActionForm;
import org.apache.struts.action.ActionMapping;
import org.apache.struts.upload.FormFile;

public class MyUploadForm extends ActionForm {

  /**
   * 
   */
  private static final long serialVersionUID = 6650496540449458586L;
  
  private FormFile uploadFile = null;
  
  private String filetitle;
  
  public String getFiletitle() {
    return filetitle;
  }

  public void setFiletitle(String filetitle) {
    this.filetitle = filetitle;
  }

  public ActionErrors validate(ActionMapping mapping,
      HttpServletRequest request) {
    return null;
  }
  
  public void reset(ActionMapping mapping, HttpServletRequest request) {
  }

  public FormFile getUploadFile() {
    return uploadFile;
  }

  public void setUploadFile(FormFile uploadFile) {
    this.uploadFile = uploadFile;
  }

}

Copier après la connexion

2.5 struts-config.xml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE struts-config PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 1.2//EN" "struts-config_1_2.dtd">

<struts-config>
  <data-sources />
  <form-beans>
    <form-bean name="myUploadForm" type="com.rocky.console.form.MyUploadForm" />
  </form-beans>
  <global-exceptions />
  <global-forwards />
  <action-mappings>
    <!-- rocky myupload -->
    <action path="/myUpload" attribute="myUploadForm" name="myUploadForm" type="com.rocky.console.action.MyUploadAction" />
  </action-mappings>
  <message-resources parameter="ApplicationResources" />
</struts-config>

Copier après la connexion

2.6 Description

2.6.1 jquery.form.js peut être téléchargé en ligne

Utilisez var formData = new FormData(), puis formData.append("myfile", document.getElementById("myfile" ) .files[0]);form.append...

Lorsqu'il y a de nombreux champs de formulaire, il est difficile d'écrire de nombreux ajouts. Évidemment, ajaxSubmit est beaucoup plus pratique

2.6.2. Les données du front-end passent par ActionForm, les encapsulent directement dans son objet de sous-classe (MyActionForm), utilisent FormFile pour recevoir des fichiers et String pour recevoir d'autres types de données

Bien sûr, elles sont injectées selon le correspondance biunivoque de l'attribut name de la balise HTML

2.6.3 Comment ActionForm correspond-il au bean personnalisé implémenté (MyUploadForm) ?

Dans struts-config.xml, form-bean définit son propre bean via

Ce type de mappage

Recommandations associées :

Exemple de partage de code de téléchargement de fichiers asynchrones Ajax

Implémentation Javascript de la fonction de téléchargement de fichiers asynchrones Explication détaillée

Partage de l'utilisation du plug-in pour télécharger des fichiers de manière asynchrone à l'aide de jQuery

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!