首页 > 代码库 > struts2 JS获取上传文件的绝对路径，兼容IE和FF
struts2 JS获取上传文件的绝对路径，兼容IE和FF
因为file控件上传失败后会自动清空，所以使用文本框来保存上传路径，而且在不同的浏览器下，控件的样式也需要兼容。下面是自己用到的实例
// 初始化判断浏览器的版本，根据版本的不同使用不同的样式
function getExplorer() { //IE if (navigator.userAgent.indexOf("MSIE")>=0) { document.getElementById("1").style.display = "block"; document.getElementById("2").style.display = "none"; document.getElementById("FileUpload").className = "file"; document.getElementById("box").className = "file-box"; } //Firefox else if (navigator.userAgent.indexOf("Firefox")>=0) { document.getElementById("1").style.display = "none"; document.getElementById("2").style.display = "block"; document.forms[0].elements["propertyName"].style.width="625px"; } //Chrome else if(navigator.userAgent.indexOf("Chrome") >=0) { document.getElementById("1").style.display = "block"; document.getElementById("2").style.display = "none"; document.forms[0].elements["propertyName"].style.width="495px"; document.getElementById("ieBtn").style.display = "none"; document.getElementById("FileUpload").style.width = "93px"; } //Safari else if(navigator.userAgent.indexOf("Safari") >=0 ) { document.getElementById("1").style.display = "block"; document.getElementById("2").style.display = "none"; document.forms[0].elements["propertyName"].style.width="585px"; document.getElementById("ieBtn").style.display = "none"; document.getElementById("FileUpload").style.width = "90px"; }}
样式的代码
.file-box{ position:relative;width:55px} .btn{ width:55px;} .file{ position:absolute;top:0; right:0px; height:24px; filter:alpha(opacity:0);opacity: 0;width:0px }
html的代码
由于使用的是struts2
控件的name是formInfo.propertyName
修改的场合时，控件的value是前面的action通过request.setAttribute("Form", pForm)设置的，jsp接收时必须按照下面那么写
<table align="center"><tr><td ><s:textfield name="formInfo.propertyName" value="%{#request.Form.propertyName}" size="512" maxlength="512" style="width:620px;" readonly="true" /></td><td id="1"><div id="box"> <input type="button" value="参照" class="btn" id="ieBtn" /> <input type="file"name="filepropertyName" id="FileUpload" size="1" onchange="Change()" /></div></td><td id="2"><input type="button" name="upload" class="btn" id="upload" value="参照" onclick="selectPDF()"/></td><td ><input type="button" value="クリア" class="btn" onclick="delPdf()"/></td></tr></table>
单击按钮把路径显示到文本框中的js
// 当file的值改变时 把路径赋值给文本框function Change() { //IE if (navigator.userAgent.indexOf("MSIE")!=-1||navigator.userAgent.indexOf("Chrome") !=-1||navigator.userAgent.indexOf("Safari") !=-1) { var localpath = document.getElementById("FileUpload").value; document.forms[0].elements["propertyName"].value =http://www.mamicode.com/ localpath; } //FF else if (navigator.userAgent.indexOf("Firefox")!=-1) { readFileFirefox() } } //FFfunction readFileFirefox() { try { netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect"); } catch (e) { return; } var fileName=document.getElementById("FileUpload").value; var file = Components.classes["@mozilla.org/file/local;1"] .createInstance(Components.interfaces.nsILocalFile); try { file.initWithPath( fileName.replace(/\//g, "\\\\") ); } catch(e) { if (e.result!=Components.results.NS_ERROR_FILE_UNRECOGNIZED_PATH) throw e; return; } if ( file.exists() == false ) { alert("File ‘" + fileName + "‘ not found."); return; } document.forms[0].elements["propertyName"].value =http://www.mamicode.com/file.path;
}
// 火狐浏览器下 单击按钮打开file控件 弹出文件选中对话框
function selectPDF()
{
document.forms[0].FileUpload.click();
}
struts2 JS获取上传文件的绝对路径，兼容IE和FF
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。