使IE7下文件上传控件的文件路径不可编辑的方法小结
2012-02-16 16:26
351 查看
常规的Web应用程序中涉及到文件上传的部分都不可避免地会使用到<input type="file"/>控件,在上传文件的时候通过点击“浏览”按钮,在弹出的文件选择对话框中选择本地要上传的文件。当然,如果你已经知道要上传的文件的本地路径,也可以复制路径到控件的输入框中(例如要选择的文件的路径特别长)。这就存在一个问题,如果你所复制的文件路径根本不存在,那么上传的时候就无法正确获取到文件,而且在javascript中没有判断该控件所选择的文件是否存在的方法,涉及到浏览器的安全性,大多数时候我们是不能通过javascript来操作客户端本地文件的。
其实在FireFox和IE8中已经对这个控件进行了相应的限制,如果你在这两种浏览器中查看带有<input type="file"/>标签的页面,会看到根本不允许用户直接输入,而只能通过点击“浏览”按钮来选择文件,这样就可以有效地确保用户所选文件的合法性。但是在IE7和一些低版本的浏览器中仍然是可以输入的,这个时候就需要对这个控件进行一些限制,下面是可以采用的方法:
1. 使用contenteditable属性
使用该属性可以有效地限制用户在<input type="file"/>控件中手动输入内容,而只能通过文件选择对话框选择文件。
Html代码
<input type="file" id="file1" contenteditable="false" />
2. 替代法
使用隐藏的<input type="file"/>控件,然后用一个只读的文本框和一个按钮来模拟<input type="file"/>的功能。
Html代码
<input type="file" name="file" onpropertychange="file1.value=this.value" style=display:none/>
<input type="text" name="file1" readonly/>
<input type="button" value="浏览" id="button1" name="button1" onclick="file.click()"/>
3. 使用脚本事件限制控件输入
将<input type="file"/>控件的鼠标右键菜单、按键事件限制住,不让用户有机会输入。
Html代码
<input type="file" onkeydown="return false" onkeyup="return false" oncontextmenu="return false">
其实在FireFox和IE8中已经对这个控件进行了相应的限制,如果你在这两种浏览器中查看带有<input type="file"/>标签的页面,会看到根本不允许用户直接输入,而只能通过点击“浏览”按钮来选择文件,这样就可以有效地确保用户所选文件的合法性。但是在IE7和一些低版本的浏览器中仍然是可以输入的,这个时候就需要对这个控件进行一些限制,下面是可以采用的方法:
1. 使用contenteditable属性
使用该属性可以有效地限制用户在<input type="file"/>控件中手动输入内容,而只能通过文件选择对话框选择文件。
Html代码
<input type="file" id="file1" contenteditable="false" />
2. 替代法
使用隐藏的<input type="file"/>控件,然后用一个只读的文本框和一个按钮来模拟<input type="file"/>的功能。
Html代码
<input type="file" name="file" onpropertychange="file1.value=this.value" style=display:none/>
<input type="text" name="file1" readonly/>
<input type="button" value="浏览" id="button1" name="button1" onclick="file.click()"/>
3. 使用脚本事件限制控件输入
将<input type="file"/>控件的鼠标右键菜单、按键事件限制住,不让用户有机会输入。
Html代码
<input type="file" onkeydown="return false" onkeyup="return false" oncontextmenu="return false">
相关文章推荐
- asp.net用input控件上传文件时Check错误文件路径的方法
- phpcms v9多文件上传字段获取文件url路径地址的方法
- 前段时间做文件上传控件,找到些关于ASP.NET中文件操作的方法,顺便记录下来,和大家共享。
- 关于Html动态添加上传文件控件inputFile(附件)及清除已选择的文件的几个方法
- ASP.NET多文件上传控件Uploadify的使用方法
- struts2 JS获取上传文件的绝对路径,兼容IE和FF
- ASP.NET文件上传控件Uploadify的使用方法
- 如何使用JS获取IE上传文件路径(IE7,8)
- 怎么做个IE控件实现文件上传,而不用“浏览”这类的控件呢
- IE和火狐关于文件上传路径然后下载的问题(正常路径IE识别,火狐识别不出正常的路径)
- input表单的默认提示js方法(ie低版本不可编辑带光标bug)
- ASP.NET文件上传控件Uploadify的使用方法
- PHP上传文件时自动分配路径的方法
- asp.net上传文件时提示,不支持给定路径的格式解决方法
- 上传时获取文件的完整路径图片预览的js代码(兼容Firfox和IE)
- fileinput组件将文件上传到服务器的路径编写方法以及Tomcat的配置
- 文件上传(firefox 1.01 和ie 6.0中上传控件的区别)
- 在IE中必须点击input file 控件的浏览按钮才能提交上传,否则没有权限 。js文件报拒绝访问,解决办法是将input file控件定位到你要点击的地方 ,并且input file做成透明的
- 关于在.net中 预览上传控件中路径的图片 的方法
- 自制文件上传JS控件,支持IE、chrome、firefox etc.