ajaxfileupload单文件上传兼容IE8及 input type=file样式修改

ajaxfileupload单文件上传兼容IE8

1、引用jquery和ajaxfileupload.js<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>

<script src="js/ajaxfileupload.js" type="text/javascript" charset="utf-8"></script>

2、手写css
input.myFileUpload {
position: absolute; right: 0;
top: 0;
font-size: 100px;
opacity: 0;
filter: alpha(opacity=0);
}
a.file-button {
display: inline-block;
width: 100px;
height: 40px;
background: #00b3ee;
position: relative;
overflow: hidden;
text-align: center;
color: #fff;
border-radius: 3px;
line-height: 40px;
text-decoration: none;
float: left;
}
#file_name {
line-height: 40px;
float: left;
padding-left: 15px;
}3、载入html

<div class="">
<a href="#" class="file-button">选择文件
<input type="file"  class="myFileUpload"  name="myFile" id="fileInput" onchange="ajaxupload(this);"/>
</a>
<span id="file_name" ></span>
</div>

  载入CSS后如图



 4、关于文件上传的js代码（我这里是doc、docx格式的word文件上传）
<script type="text/javascript">
function ajaxupload(dom){
var arrs=$(dom).val().split('\\');
var arr=$(dom).val().split('.');
var filetype=arr[arr.length-1];//文件类型
if(filetype=="doc"||filetype=="docx"){//验证上传文件格式
var filename=arrs[arrs.length-1];
$("#file_name").text(filename).removeAttr("style","color:red");
var feid=dom.id;//input框ID属性
$.ajaxFileUpload({
fileElementId: feid, //需要上传的文件域的ID，即<input type="file">的ID。
url: bsurl + '/web/warning/generallyFile', //后台方法的路径
type: 'post', //当要提交自定义参数时，这个参数要设置成post
dataType: 'json', //服务器返回的数据类型。可以为xml,script,json,html。如果不填写，jQuery会自动判断。
secureuri: false, //是否启用安全提交，默认为false。
async : true, //是否是异步
success: function(data) { //提交成功后自动执行的处理函数，参数data就是服务器返回的数据。

},
error: function(data, status, e) { //提交失败自动执行的处理函数。

}
});
}else{//格式不正确时给出提示
$("#file_name").text("请上传后缀为doc或者docx的word文档").attr("style","color:red");
}
}

</script>4、后台代码我这里是status2private String myFileContentType;
private String myFileName;
private File myFile;
private String fileFileName;
private String fileFileContentType;
public String getFileFileContentType() {
return fileFileContentType;
}
public void setFileFileContentType(String fileFileContentType) {
this.fileFileContentType = fileFileContentType;
}
public String getFileFileName() {
return fileFileName;
}
public void setFileFileName(String fileFileName) {
this.fileFileName = fileFileName;
}
public String getMyFileContentType() {
return myFileContentType;
}
public void setMyFileContentType(String myFileContentType) {
this.myFileContentType = myFileContentType;
}
public String getMyFileName() {
return myFileName;
}
public void setMyFileName(String myFileName) {
this.myFileName = myFileName;
}
public File getMyFile() {
return myFile;
}
public void setMyFile(File myFile) {
this.myFile = myFile;
}
@Action("generallyFile")
public String generallyFile(){
try {
String text = "";
FileInputStream input = new FileInputStream(myFile);
FileInputStream inputStream = new FileInputStream(myFile);
byte[] b = new byte[10];
input.read(b, 0, b.length);
String fileCode = bytesToHexString(b);
input.close();
if("504b0304".equals(fileCode.substring(0,8))){//docx文本
XWPFDocument xdoc = new XWPFDocument(inputStream);
POIXMLTextExtractor extractor = new XWPFWordExtractor(xdoc);
text = extractor.getText();
}else if("d0cf11e0".equals(fileCode.substring(0,8))){//doc文本
WordExtractor wordExtractor = new WordExtractor(inputStream);
text = wordExtractor.getText();
}
inputStream.close();
if("".equals(text)||text==null) {
text = "没有提取到文档信息，请尝试手动复制。";
}
setMsg(text);
} catch (final Exception e) {

}
return "generallyFile";
}https://pan.baidu.com/s/1bqj9RSr