javascript模拟简单的文件上传域

Js代码  

1. /** 
2.  * @author wsf (javascript模拟文件上传域) 
3.  */  
4. function createFileIpt(container, name) {  
5.     var filhtml = [];  
6.     filhtml.push("<div class='file-box'>");  
7.     filhtml.push("<input type='text' name='textfield' id='textfield' class='txt' />");  
8.     filhtml.push("<input type='button' class='btn' value='浏览...' />");  
9.     filhtml.push("<input type='file' name='"  
10.                     + name  
11.                     + "' class='file' id='"  
12.                     + name  
13.                     + "' size='28' οnchange=\"document.getElementById('textfield').value=this.value\"/>");  
14.     filhtml.push("</div>");  
15.     container.append(filhtml.join(""));  
16.     appendCss();  
17. }  
18. /** 
19.  * 添加样式 
20.  * @returns 
21.  */  
22. function appendCss() {  
23.     $(".file-box").css({  
24.         "position" : "relative",  
25.         "width" : "100%",  
26.         "cursor":"pointer"  
27.     });  
28.     $(".txt").css({  
29.         "height" : "22px",  
30.         "border" : "1px solid #cdcdcd",  
31.         "width" : "180px",  
32.         "cursor":"pointer"  
33.     });  
34.     $(".btn").css({  
35.         "background-color" : "#FFF",  
36.         "border" : "1px solid #CDCDCD",  
37.         "height" : "24px",  
38.         "width" : "70px",  
39.         "cursor":"pointer"  
40.     });  
41.     var _pos = $(".txt").position();  
42.     $(".file").css({  
43.         "position" : "absolute",  
44.         "top" : "0",  
45.         "left" : _pos.left + "px",  
46.         "height" : "24px",  
47.         "filter" : "alpha(opacity:0)",  
48.         "opacity" : "0",  
49.         "width" : "250px",  
50.         "cursor":"pointer"  
51.     });  
52. }  
53. /** 
54.  * 创建 
55.  */  
56. createFileIpt($("#filecontainer"), "logo");  
57. /** 
58.  * ajax上传文件 
59.  * @returns {Boolean} 
60.  */  
61. function ajaxFileUpload() {  
62.     $.ajaxFileUpload({  
63.         url : 'some.do',//用于文件上传的服务器端请求地址  
64.         secureuri : false,//一般设置为false  
65.         fileElementId : 'logo',//文件上传空间的id属性  <input type="file" id="file" name="file" />  
66.         dataType : 'json',//返回值类型 一般设置为json  
67.         success : function(data, status)//服务器成功响应处理函数  
68.         {  
69.             alert(data.message);//从服务器返回的json中取出message中的数据,其中message为在struts2中action中定义的成员变量  
70.             if (typeof (data.error) != 'undefined') {  
71.                 if (data.error != '') {  
72.                     alert(data.error);  
73.                 } else {  
74.                     alert(data.message);  
75.                 }  
76.             }  
77.         },  
78.         error : function(data, status, e)//服务器响应失败处理函数  
79.         {  
80.             alert(e);  
81.         }  
82.     })  
83.     return false;  
84. }