jquery的ajaxSubmit()和多文件上传-阿里云开发者社区

开发者社区> y0umer> 正文

jquery的ajaxSubmit()和多文件上传

简介:               My JSP 'fileupload.jsp' starting page               $(document).
+关注继续查看

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<%

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

    <base href="<%=basePath%>">

   

    <title>My JSP 'fileupload.jsp' starting page</title>

   

<meta http-equiv="pragma" content="no-cache">

<meta http-equiv="cache-control" content="no-cache">

<meta http-equiv="expires" content="0">   

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

<meta http-equiv="description" content="This is my page">

<!--

<link rel="stylesheet" type="text/css" href="styles.css">

-->

  </head>

  <script type="text/javascript" src="./js/jquery.js" ></script>

<script type="text/javascript" src="./js/jquery.form.js"></script>

  <script type="text/javascript">

$(document).ready(function(){

     

              

            $("#button").click(function () {

             alert("所做的批量处理操作没有成功,请重试");

            subForm();

            }); 

    });

//-------------------form---------------------------------

//表單的異步提交

var options = {

//iframe:true,

dataType:"xml", // 或'script',不能用'json',这种方式在三种浏览器中都不行,即回调函数不执行

  type:'post',

  url: "/SHOPcity/servlet/uploadTest", //http://localhost:8080/SHOPcity/fileupload.jsp

  beforeSubmit:showRequest,  // pre-submit callback

       success:showResponse,

       clearForm:true ,

       // other available options:

      // target:'#baseInfo_iframe'   // target element(s) to be updated with server response

       //resetForm: true        // reset the form after successful submit

       // $.ajax options can be used here too, for example:

       //timeout:   3000

     };

function subForm(){

alert("xxxx");

$("#myform").ajaxSubmit(options);

}

     function showRequest(formData, jqForm, options) {

  var queryString = $.param(formData);

         alert('About to submit: \n\n' + queryString);

  }

 

function showResponse(responseText, statusText)   {

var dataType;

$(responseText).find("msg").each(function() {

   var field = $(this);

    //field.attr("nub");//读取节点属性

   dataType = field.find("content").text();//读取子节点的值

  

});

          alert('status: ' + statusText + '\n\nresponseText: \n' + responseText+'\n:'+ dataType );

}

  </script>

  <body>

    jaThis is my JSP page. <br>

   

     <form name="myform" id="myform" action="./servlet/uploadTest" method="post" enctype="multipart/form-data">

File:<br>

<input type="text" name="txtlink" ><br/>

<input type="file" name="myfile1"><br>

<input type="file" name="myfile2"><br>

<input type="file" name="myfile3"><br>

<textarea name="textarea" rows="10" cols="30">  </textarea>

<br>

 

  <button type="button" id="button">提交</button>

</form>

  </body>

</html>

 

http://hi.baidu.com/zjcjava/item/1080cf4a76558907c01613f0

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
微服务架构 | *2.3 Spring Cloud 启动及加载配置文件源码分析(以 Nacos 为例)
Spring Cloud 要实现统一配置管理,需要解决两个问题:如何获取远程服务器配置和如何动态更新配置;在这之前,我们先要知道 Spring Cloud 什么时候给我们加载配置文件;
6 0
冬季实战营第一期:从零到一上手玩转云服务器学习报告
从零到一上手玩转云服务器,第一期学习报告
6 0
冬季实战营第一期学习报告
冬季实战营第一期学习报告
10 0
微服务架构 | *2.4 Nacos 获取配置与事件订阅机制的源码分析
为方便理解与表达,这里把 Nacos 控制台和 Nacos 注册中心称为 Nacos 服务器(就是 web 界面那个),我们编写的业务服务称为 Nacso 客户端; 由于篇幅有限,这里将源码分析分为上下两篇,其中上篇讲获取配置与事件订阅机制,下篇讲长轮询定时机制;
4 0
类与对象(类与对象基本定义)|学习笔记
快速学习 类与对象(类与对象基本定义)
4 0
冬季实战营第一期学习报告
1月17至22日,我有幸参加了阿里云组织的“冬季实战营第一期:从零到一上手玩转云服务器”抱着期待和学习的心情,我参与其中,经过训练,收益良多、颇有收获
18 0
学习报告第一期
我有幸参加了阿里云组织的“冬季实战营第一期:从零到一上手玩转云服务器”抱着期待和学习的心情,我参与其中,经过训练,收益良多、颇有收获
5 0
递归函数|学习笔记
快速学习递归函数
5 0
+关注
y0umer
高级网络安全技术员
906
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
《2021云上架构与运维峰会演讲合集》
立即下载
《零基础CSS入门教程》
立即下载
《零基础HTML入门教程》
立即下载