html页面头载入了jquery1.11.3的版本,我使用ajaxfileupload.js插件,但是这个插件要求1.8以下的版本

1、引入AjaxFileUpload插件相关的js

<script type="text/javascript" src="<%=basePath%>resources/js/jquery-1.2.1.js"></script>

<script type="text/javascript" src="<%=basePath%>resources/js/ajaxfileupload.js"></script>

备注:测试发现,ajaxfileupload对jQuery版本是有要求的,在使用中ajaxfileupload和jQuery对应的js版本要一致,不然会导致异常发生,可以从ajaxfileupload官网下载,避免版本冲突。

2、实现上传功能代码

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

<%@ include file="/base.jsp" %>

<%

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>ajax文件上传</title>

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

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

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<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="validate/ajaxfileupload.css" />

<script type="text/javascript" src="validate/jquery-1.6.2.min.js"></script>

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

<script type="text/javascript">

$(function(){

//上传图片

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

alert(ajaxFileUpload());

});

});

function ajaxFileUpload() {

// 开始上传文件时显示一个图片

$("#wait_loading").ajaxStart(function() {

$(this).show();

// 文件上传完成将图片隐藏起来

}).ajaxComplete(function() {

$(this).hide();

});

var elementIds=["flag"]; //flag为id、name属性名

$.ajaxFileUpload({

url: 'uploadAjax.htm',

type: 'post',

secureuri: false, //一般设置为false

fileElementId: 'file', // 上传文件的id、name属性名

dataType: 'text', //返回值类型,一般设置为json、application/json

elementIds: elementIds, //传递参数到服务器

success: function(data, status){

alert(data);

},

error: function(data, status, e){

alert(e);

}

});

//return false;

}

</script>

</head>

<body>

<div id="wait_loading" style="padding: 50px 0 0 0;display:none;">

<div style="width: 103px;margin: 0 auto;"><img src="<%=path %>/images/loading.gif"/></div>

<br></br>

<div style="width: 103px;margin: 0 auto;"><span>请稍等...</span></div>

<br></br>

</div>

<input type="file" id="file" name="file"><br/>

<input type="hidden" id="flag" name="flag" value="ajax文件上传"/>

<input type="button" id="btnUpload" value="上传图片" />

</body>

</html>