1. 程式人生 > >ajaxfileupload單檔案上傳相容IE8及 input type=file樣式修改

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、後臺程式碼我這裡是status2

private 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