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

目录
相关文章
|
JavaScript 前端开发 PHP
jQuery插件AjaxFileUpload文件上传实现Javascript多文件上传功能
Ajax file upload plugin是一个功能强大的文件上传jQuery插件,可自定义链接、或其它元素庖代传统的file表单上传结果,可实现Ajax动态提示文件上传 过程,同时支撑多文件上传,AjaxFileUpload文件上传插件功能斗劲稳定,今朝应用也斗劲多,简单应用实例如下: 查看AjaxFileUpload相干jQuery官方文档介绍 AjaxFileUpload JS库
1621 0
|
JavaScript 前端开发 PHP
jQuery插件AjaxFileUpload文件上传实现Javascript多文件上传功能
引用:http://cgxcn.blog.163.com/blog/static/1323124220095472652900/ Ajax file upload plugin是一个功能强大的文件上传jQuery插件,可自定义链接、图片或其它元素取代传统的file表单上传效果,可实现Ajax动态提...
1413 0
|
前端开发
ajax submit - jquery
function submitForm() {            var url = "/RefRoute/InsertTemplate";            //alert("submit");            var options = {               ...
596 0
|
JSON JavaScript 数据格式
ajaxSubmit插件jQuery1.4.2版JSON问题
jQuery Form 插件基于jQuery v1.4.2版返回JSON数据时一直报错;修改以下内容可恢复; 原后台输出数据格式如:{sitename:'开发者网络',siteurl:'www.
819 0
|
4天前
|
JavaScript 前端开发
jQuery和CSS3滑动展开菜单按钮插件
这是一款jQuery和CSS3滑动展开菜单按钮插件。该滑动展开菜单按钮在用户点击主菜单按钮之后,子菜单以滑动的方式依次展开
39 21
|
5天前
|
JavaScript
jquery图片和pdf文件预览插件
EZView.js是一款jquery图片和pdf文件预览插件。EZView.js可以为图片和pdf格式文件生成在线预览效果。支持的文件格式有pdf、jpg、 png、jpeg、gif。
36 16
|
3天前
|
移动开发 JavaScript 前端开发
简单易用的jquery响应式轮播图插件ma5slider
ma5slider是一款简单易用的jquery响应式轮播图插件。该轮播图支持鼠标拖拽,可以通过CSS定制外观,支持无限循环模式,内置水平,垂直和淡入淡出三种轮播图过渡动画效果。
|
5天前
|
JavaScript
简洁实用的jQuery进度条插件
这是一款简洁实用的jQuery进度条插件。该插件使用简单,通过在页面中放置指定的HTML代码,即可生成带动画效果的进度条。
|
4天前
|
JavaScript 容器
jQuery文字跑马灯插件Marquee
jQuery.Marquee是一款jQuery文字跑马灯插件。jQuery.Marquee跑马灯插件可以结合使用CSS3动画,制作文字的上下左右移动效果。