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. pandas写入多组数据到excel不同的sheet

    今天朋友问了我个需求,就是如何将多个分析后的结果,也就是多个DataFrame,写入同一个excel工作簿中呢? 之前我只写过放在一个sheet中,但是怎么放在多个sheet中呢?下面我在本地wind ...

  2. kswapd和pdflush

    首 先,它们存在的目的不同,kswap的作用是管理内存,pdflush的作用是同步内存和磁盘,当然因为数据写入磁盘前可能会换存在内存,这些缓存真正写 入磁盘由三个原因趋势:1.用户要求缓存马上写入磁盘 ...

  3. POJ 3984 迷宫问题 (BFS + Stack)

    链接 : Here! 思路 : BFS一下, 然后记录下每个孩子的父亲用于找到一条路径, 因为寻找这条路径只能从后向前找, 这符合栈的特点, 因此在输出路径的时候先把目标节点压入栈中, 然后不断的向前 ...

  4. HDU 1465（错排公式）

    不容易系列之一 题意: 一个人要寄n个信封,结果装错了.信纸的编号为1到n,信封的编号为1到n,信纸的编号不能和信封的编号一样,全都不能一样. 思路:错排公式. D(n)表示n件信封装错的所有的情况. ...

  5. 第四节：Web爬虫之pyquery解析库

    PyQuery库也是一个非常强大又灵活的网页解析库,如果你有前端开发经验的,都应该接触过jQuery,那么PyQuery就是你非常绝佳的选择,PyQuery 是 Python 仿照 jQuery 的严 ...

  6. 【模板】最小生成树Kruskal

    洛谷3366 #include<cstdio> #include<algorithm> using namespace std; ,maxm=; ,ans=; struct e ...

  7. 【转载】Apache shutdown unexpectedly启动错误解决方法

    http://blog.csdn.net/dong123dddd/article/details/21372179 xampp启动时显示的错误为: 9:52:41  [Apache] Attempti ...

  8. Thinkphp5跨域问题

    关于代码分离可能会遇到json传输接收不到的问题(可能00) 起初我百度到解决此问题可以用jsonp来发送并接受,可是这只是一时之计 以后也会不方便所以我发现了一下方法 在app顶层创建文件commo ...

  9. 【POJ 1981】Circle and Points(已知圆上两点求圆心坐标)

    [题目链接]:http://poj.org/problem?id=1981 [题意] 给你n个点(n<=300); 然后给你一个半径R: 让你在平面上找一个半径为R的圆; 这里R=1 使得这个圆 ...

  10. Vue2构建项目实战

    转载整理自http://blog.csdn.net/fungleo/article/details/77575077 vue构建单页应用原理 SPA 不是指水疗.是 single page web a ...