在IE上,input(type=file)默认获取到的value值是路径。
因此用js来获取fileupload中的上传文件的文件名需要多方面考虑。
示例代码:
<form action="" method="get" onSubmit="return false">
<input type="text" name="test" id="test">
<input type="file" name="testFile" onChange="if(this.value)insertTitle(this.value)">
<input type="submit" value="提交">
</form>
<script language="javascript">
function insertTitle(path){
var test1 = path.lastIndexOf("/") //对路径进行截取
var test2 = path.lastIndexOf("\\") //对路径进行截取
var test= Math.max(test1, test2)
if(test<0){
document.getElementById("test").value = path
}else{
document.getElementById("test").value = path.substring(test + 1)//赋值文件名
}
}
</script>
<input id="file_Up" name="file_Up" type="file" onchange="getFileSize(this.value)"/><input id="sub_Import" type="submit" value="导入" />
js中function getFileSize() {
var btnsave = document.getElementById("sub_Import")
btnsave.disabled = true
var filepath = ""
var fileupload = document.getElementById("file_Up")
if (fileupload.value.length < 5) {
alert('请选择文件!')
return
}
var agent = window.navigator.userAgent
if (agent.indexOf("Firefox") >= 1) {
var maxsize = 4 * 1024 * 1024
var size = fileupload.files[0].size
if (size > parseInt(maxsize)) {
alert("文件超过大小!")
return false
}
else {
btnsave.disabled = false
return true
}
}
else {
fileupload.select()
fileupload.blur()
filepath = document.selection.createRange().text
try {
var fso, f, fname, fsize
var flength = 4 * 1024 //设置上传的文件最大值(单位:kb),超过此值则不上传。
fso = new ActiveXObject("Scripting.FileSystemObject")
f = fso.GetFile(filepath) //文件的物理路径
fname = fso.GetFileName(filepath) //文件名(包括扩展名)
fsize = f.Size //文件大小(bit)
fsize = fsize / 1024
//去掉注释,可以测试
alert("文件路径:" + f)
alert("文件名:" + fname)
alert("文件大小:" + fsize + "kb")
if (fsize > flength) {
alert("上传的文件到小为:" + fsize + "kb,\n超过最大限度" + flength + "kb,不允许上传 ")
return false
}
else {
btnsave.disabled = false
return true
}
} catch (e) {
alert(e + "\n 跳出此消息框,是由于你的activex控件没有设置好,\n" +
"你可以在浏览器菜单栏上依次选择\n" +
"工具->internet选项->\"安全\"选项卡->自定义级别,\n" +
"打开\"安全设置\"对话框,把\"对没有标记为安全的\n" +
"ActiveX控件进行初始化和脚本运行\",改为\"启动\"即可")
return false
}
}
}
//fileupload对象是文本框类标签出现时候就会被创建出来//获取上传文件的文件名其实就是获取文本框type为file中的value,虽然这个value一般来说是只读
//下面贴代码
<!DOCTYPE <html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8">
</head>
<body>
<span>文件名:</span><input type="file" />
<script type="text/javascript" src="
<script type="text/javascript">
!function($){
var reg = /^(\w)(:)(\\\w+)*\\(\w+.[a-zA-Z]+)*(\w+)*$/g
$('input').on('change', function(){
var name = $('input').val()
// name = name.match(reg)
name = name.replace(reg,"$4")
alert(name)
})
}(jQuery)
</script>
</body>
</html>
//测试结果