javascript模拟简单的文件上传域
/** * @author wsf (javascript模拟文件上传域) */ function createFileIpt(container, name) { var filhtml = []; filhtml.push("<div class='file-box'>"); filhtml.push("<input type='text' name='textfield' id='textfield' class='txt' />"); filhtml.push("<input type='button' class='btn' value='浏览...' />"); filhtml.push("<input type='file' name='" + name + "' class='file' id='" + name + "' size='28' onchange=\"document.getElementById('textfield').value=this.value\"/>"); filhtml.push("</div>"); container.append(filhtml.join("")); appendCss(); } /** * 添加样式 * @returns */ function appendCss() { $(".file-box").css({ "position" : "relative", "width" : "100%", "cursor":"pointer" }); $(".txt").css({ "height" : "22px", "border" : "1px solid #cdcdcd", "width" : "180px", "cursor":"pointer" }); $(".btn").css({ "background-color" : "#FFF", "border" : "1px solid #CDCDCD", "height" : "24px", "width" : "70px", "cursor":"pointer" }); var _pos = $(".txt").position(); $(".file").css({ "position" : "absolute", "top" : "0", "left" : _pos.left + "px", "height" : "24px", "filter" : "alpha(opacity:0)", "opacity" : "0", "width" : "250px", "cursor":"pointer" }); } /** * 创建 */ createFileIpt($("#filecontainer"), "logo"); /** * ajax上传文件 * @returns {Boolean} */ function ajaxFileUpload() { $.ajaxFileUpload({ url : 'some.do',//用于文件上传的服务器端请求地址 secureuri : false,//一般设置为false fileElementId : 'logo',//文件上传空间的id属性 <input type="file" id="file" name="file" /> dataType : 'json',//返回值类型 一般设置为json success : function(data, status)//服务器成功响应处理函数 { alert(data.message);//从服务器返回的json中取出message中的数据,其中message为在struts2中action中定义的成员变量 if (typeof (data.error) != 'undefined') { if (data.error != '') { alert(data.error); } else { alert(data.message); } } }, error : function(data, status, e)//服务器响应失败处理函数 { alert(e); } }) return false; }
直接在页面引入js 并且在页面定义一个放上传域的dom就行了
相关推荐
nmgxzm00 2020-11-10
ifconfig 2020-10-14
hhanbj 2020-11-17
zfszhangyuan 2020-11-16
古叶峰 2020-11-16
一个智障 2020-11-15
jipengx 2020-11-12
81427005 2020-11-11
xixixi 2020-11-11
游走的豚鼠君 2020-11-10
苗疆三刀的随手记 2020-11-10
Web卓不凡 2020-11-03
小飞侠V 2020-11-02
帕尼尼 2020-10-30
爱读书的旅行者 2020-10-26
帕尼尼 2020-10-23
杏仁技术站 2020-10-23
淼寒儿 2020-10-22