jquery的ajaxSubmit()和多文件上传

<%@ 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>

多文件上传ajax jquery的更多相关文章

  1. jQuery文件上传插件jQuery Upload File 有上传进度条

    jQuery文件上传插件jQuery Upload File 有上传进度条 jQuery文件上传插件jQuery Upload File,插件使用简单,支持单文件和多文件上传,支持文件拖拽上传,有进度 ...

  2. 强大的支持多文件上传的jQuery文件上传插件Uploadify

    支持多文件上传的jQuery文件上传插件Uploadify,目前此插件有两种版本即Flash版本和HTML5版本,对于HTML5版本会比较好的支持手机浏览器,避免苹果手机Safari浏览器不支持Fla ...

  3. [转]一个文件上传的jquery插件

    http://www.jb51.net/article/51547.htm 这篇文章主要介绍了使用ajaxfileupload.js实现ajax上传文件php版,需要的朋友可以参考下     无论是P ...

  4. python 全栈开发，Day75(Django与Ajax,文件上传,ajax发送json数据,基于Ajax的文件上传,SweetAlert插件)

    昨日内容回顾 基于对象的跨表查询 正向查询:关联属性在A表中,所以A对象找关联B表数据,正向查询 反向查询:关联属性在A表中,所以B对象找A对象,反向查询 一对多: 按字段:xx book ----- ...

  5. 【文件上传】jquery之ajaxfileupload异步上传插件

    来自:http://www.blogjava.net/sxyx2008/archive/2010/11/02/336826.html 由于项目需求,在处理文件上传时需要使用到文件的异步上传.这里使用J ...

  6. Django与Ajax,文件上传,ajax发送json数据,基于Ajax的文件上传,SweetAlert插件

    一.Django与Ajax AJAX准备知识:JSON 什么是 JSON ? JSON 指的是 JavaScript 对象表示法(JavaScript Object Notation) JSON 是轻 ...

  7. Asp.Net Core 3.0 学习3、Web Api 文件上传 Ajax请求以及跨域问题

    1.创建Api项目 我用的是VS2019 Core3.1 .打开Vs2019 创建Asp.Net Core Web应用程序命名CoreWebApi 创建选择API 在Controller文件夹下面添加 ...

  8. 文件上传利器JQuery上传插件Uploadify

    在做日常项目中,经常在后台需要上传图片等资源文件,之前使用过几次这个组件,感觉非常好用 ,但是每次使用的时候都是需要经过一番查阅,所以还不如记住在这里,以后使用的时候就翻翻. 他的官方网站如下:htt ...

  9. MVC文件上传 - 使用jquery异步上传并客户端验证类型和大小

    本篇体验MVC上传文件,从表单上传过渡到jquery异步上传. MVC最基本的上传文件是通过form表单提交方式 □ 前台视图部分 <% using(Html.BeginForm("F ...

随机推荐

  1. NFS指定端口，NFS缓存（转载）

    nfs服务端: #编辑/etc/nfsmount.conf,在末尾添加: #RQUOTAD_PORT=30001#LOCKD_TCPPORT=30002#LOCKD_UDPPORT=30002#MOU ...

  2. 模板中tempname与class区别

    前言 在分析traits编程之前, 我们需要对模板参数类型tempname和class有一定的了解, 要明白他们在哪些方面不同, 哪些方面相同, 这样才能对体会到traits编程的核心. 如果你已经明 ...

  3. VMware Workstation 15 安装教程

    注:操作系统必须是64位    软件:360软件管家获取 1.运行下载完成的Vmware Workstation虚拟机软件包. 虚拟机软件的安装向导初始界面 2.在虚拟机软件的安装向导界面单击“下一步 ...

  4. 10.mysql事务管理及python操作

    在用户操作MySQL过程中,对于一般简单的业务逻辑或中小型程序而言,无需考虑应用MySQL事务.但在比较复杂的情况下,往往用户在执行某些数据操作过程中,需要通过一组SQL语句执行多项并行业务逻辑或程序 ...

  5. Django - 日志工作中常用配置

    工作中常用配置 # 日志配置 BASE_LOG_DIR = os.path.join(BASE_DIR, "log") LOGGING = { 'version': 1, # 保留 ...

  6. 第2章 Python序列

    Python序列类似于C或Basic中的一维.多维数组等,但功能要强大很多,使用也更加灵活.方便,Head First Python一书就戏称列表是“打了激素”的数组. Python中常用的序列结构有 ...

  7. Java基础之构造方法及其应用

    构造方法是一种特殊的方法,它是一个与类同名且无返回值类型(连void也不能有)的方法. 对象的创建就是通过构造方法来完成,其功能主要是完成对象的初始化. 当类实例化一个对象时会自动调用构造方法.构造方 ...

  8. nyoj_676_小明的求助_201312042142-2

    小明的求助 时间限制:2000 ms  |           内存限制:65535 KB 难度:2   描述 小明对数学很有兴趣,今天老师出了道作业题,让他求整数N的后M位,他瞬间感觉老师在作弄他, ...

  9. 网络流入门 Drainage Ditches

    Time Limit : 2000/1000ms (Java/Other)   Memory Limit : 65536/32768K (Java/Other) Total Submission(s) ...

  10. [bzoj1926][Sdoi2010]粟粟的书架_二分_主席树

    粟粟的书架 bzoj-1926 Sdoi-2010 题目大意:题目链接 注释:略 想法:分成两个题 前面的我们可以二分,直接二分出来检验即可. 对于R=1的,相当一个数列,我们在上面建立主席树. 然后 ...