Thinking
          
			快樂編程，開心生活
		          		
	
          

          

          

          
	
          

          posts - 21, comments - 27, trackbacks - 0, articles - -5
          
	
 
BlogJava ::
首頁 ::
新隨筆 ::
聯系 ::
聚合
 ::
管理


          
		          		
	
          
	
          
		
			
          
			
          
		          		
		
			
          
				
					
	
          
		
          
			
          
				利用DWR實現文件上傳進度條
			
          
 			Posted on 2007-02-07 14:28 lixw 閱讀(3608) 評論(1)  編輯  收藏  
			
			


		
          
		
          來自telio.be的JS：

          ?1/*?Licence:
          ?2*???Use?this?however/wherever?you?like,?just?don't?blame?me?if?it?breaks?anything.
          ?3*
          ?4*?Credit:
          ?5*???If?you're?nice,?you'll?leave?this?bit:
          ?6*
          ?7*???Class?by?Pierre-Alexandre?Losson?--?http://www.telio.be/blog
          ?8*???email?:?plosson@users.sourceforge.net
          ?9*/
          10function?refreshProgress()
          11{
          12????UploadMonitor.getUploadInfo(updateProgress);
          13}
          14
          15function?updateProgress(uploadInfo)
          16{
          17????if?(uploadInfo.inProgress)
          18????{
          19????????document.getElementById('uploadbutton').disabled?=?true;
          20????????document.getElementById('file1').disabled?=?true;
          21
          22????????var?fileIndex?=?uploadInfo.fileIndex;
          23
          24????????var?progressPercent?=?Math.ceil((uploadInfo.bytesRead?/?uploadInfo.totalSize)?*?100);
          25
          26????????document.getElementById('progressBarText').innerHTML?=?'upload?in?progress:?'?+?progressPercent?+?'%';
          27
          28????????document.getElementById('progressBarBoxContent').style.width?=?parseInt(progressPercent?*?3.5)?+?'px';
          29
          30????????window.setTimeout('refreshProgress()',?1000);
          31????}
          32????else
          33????{
          34????????document.getElementById('uploadbutton').disabled?=?false;
          35????????document.getElementById('file1').disabled?=?false;
          36????}
          37
          38????return?true;
          39}
          40
          41function?startProgress()
          42{
          43????document.getElementById('progressBar').style.display?=?'block';
          44????document.getElementById('progressBarText').innerHTML?=?'upload?in?progress:?0%';
          45????document.getElementById('uploadbutton').disabled?=?true;
          46
          47????//?wait?a?little?while?to?make?sure?the?upload?has?started?..
          48????window.setTimeout("refreshProgress()",?1500);
          49????return?true;
          50}
          51

          一個可以有其他頁面引用的進度條頁面：
          ?1<%
          ?2????String?path?=?request.getContextPath();
          ?3????String?basePath?=?request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
          ?4%>
          ?5<script?src="<%=basePath%>common/js/upload.js">?</script>
          ?6<script?src="<%=basePath%>dwr/interface/UploadMonitor.js">?</script>
          ?7<script?src="<%=basePath%>dwr/engine.js">?</script>
          ?8<script?src="<%=basePath%>dwr/util.js">?</script>
          ?9<style?type="text/css">
          10????body?{?font:?11px?Lucida?Grande,?Verdana,?Arial,?Helvetica,?sans?serif;?}
          11????#progressBar?{?padding-top:?5px;?}
          12????#progressBarBox?{?width:?350px;?height:?20px;?border:?1px?inset;?background:?#eee;}
          13????#progressBarBoxContent?{?width:?0;?height:?20px;?border-right:?1px?solid?#444;?background:?#9ACB34;?}
          14</style>
          15
          16<div?id="progressBar"?style="display:?none;">
          17????<div?id="theMeter">
          18????????<div?id="progressBarText"></div>
          19????????<div?id="progressBarBox">
          20????????????<div?id="progressBarBoxContent"></div>
          21????????</div>
          22????</div>
          23</div>
          在dwr.xml?中的配置：
          ?1<?xml?version="1.0"?encoding="UTF-8"?>
          ?2<!DOCTYPE?dwr?PUBLIC?"-//GetAhead?Limited//DTD?Direct?Web?Remoting?2.0//EN"?
          ?3"http://getahead.ltd.uk/dwr/dwr20.dtd">
          ?4<dwr>
          ?5????<allow>
          ?6????????<create?creator="new"?javascript="UploadMonitor"?scope="script">
          ?7????????????<param?name="class"?value="be.telio.mediastore.ui.upload.UploadMonitor"/>
          ?8????????</create>
          ?9????????<convert?converter="bean"?match="be.telio.mediastore.ui.upload.UploadInfo"/>
          10????</allow>
          11</dwr>

          在web.xml中增加如下對DwrServlet的配置：

          ?1<servlet>
          ?2????<servlet-name>dwr-invoker</servlet-name>
          ?3????<servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
          ?4????<init-param>
          ?5??????<param-name>debug</param-name>
          ?6??????<param-value>false</param-value>
          ?7????</init-param>
          ?8????<init-param>
          ?9??????<param-name>pollAndCometEnabled</param-name>
          10??????<param-value>true</param-value>
          11????</init-param>
          12????<init-param>
          13??????<param-name>allowGetForSafariButMakeForgeryEasier</param-name>
          14??????<param-value>true</param-value>
          15????</init-param>
          16????<load-on-startup>2</load-on-startup>
          17??</servlet>
          18
          19??<servlet-mapping>
          20????<servlet-name>dwr-invoker</servlet-name>
          21????<url-pattern>/dwr/*</url-pattern>
          22??</servlet-mapping>
          
	
          
	


          
	    
    

          

          評論
          
	
			
          
				
          
					
          
						# re: 利用DWR實現文件上傳進度條  回復  更多評論
						  
					
          
					2009-06-16 17:36 by shenw
				
          
				
          很不錯
          
			
          
		




          





          


          

	
          
		
          
				
		
	
		
          
		
		
          只有注冊用戶登錄后才能發表評論。
          
		
          
			
		
          
			
		
          
		
		
          
		


          

		          		
		
          
		
          			
		
		
		
		
          
		
          
		
		
          
		
          
			網站導航:
		
		
          
		
          
			
		
          	
		
          
			 
		
          
		
          
			
		
          
		
          
			
				
		
          		
	
          	

          



          

				
			
          
		          		
	
          
	
          
		
			


		
	
          

          


    







          
        
	




主站蜘蛛池模板：
静宁县|
宜宾县|
大宁县|
和龙市|
清新县|
昭觉县|
台湾省|
白山市|
堆龙德庆县|
安康市|
涟水县|
厦门市|
马山县|
宁乡县|
永城市|
济源市|
招远市|
广丰县|
牙克石市|
东乌|
都江堰市|
宁津县|
深泽县|
宁强县|
衡东县|
梅河口市|
武安市|
通山县|
宁安市|
什邡市|
昆山市|
越西县|
论坛|
启东市|
富顺县|
阳泉市|
仙居县|
电白县|
会宁县|
邢台市|
中西区|