方法步骤如下:
1、首先,打开计算机,然后打开JS,在段辩碰其中创建一个HTML文件“test”。
2、然后将HTML框架添加到测试文灶哗件中。
3、然后添加两个输入,一个是button,另一个是file将ID设置为“open”样式类型为“display:握谈None”并且不显示。
4、打开后,仅显示此“打开文件”按钮。
5、现在将onclick事件添加到按钮,并调用openfile来触发ID为“open”的文件。
6、现在单击浏览器中的“打开文件”就会d出选择文件路径对话框。
1、jsd出文件选择框:
给按钮定义以下javascript函数:
var inputObj=document.createElement('input')inputObj.setAttribute('id','_ef')
inputObj.setAttribute('type','file')
inputObj.setAttribute("style",'visibility:hidden')
document.body.appendChild(inputObj)
inputObj.click()
羡裤 inputObj.value
单击已经添加函数的按钮会d出选择腔派明本地文件的对话框。
2、写一个伍告隐藏域, 当用户选择文件之后把图片的路径赋给这个隐藏域, 然后在action中就可以获取到文件的路径了,代码如下:
function showRealPath(filePath){document.getElementsByName("textfield")[0].value = filePath
}
<input type="file" name="uploadfile" onfocus="showRealPath(this.value)"/>
<input type="hidden" name="uploadfileRealPath">
最近做一个小项目,前端需要有一个功能是点击某按钮时,d出文件选择的框,然后获取目录并写入对应的输入框里,以往是选择某个文件进行上传,功能看起来有些像,但这次不同的是只能选择某个目录而不是文件,因为它并不是上传,它只是为了选择后台生成的文件保存的路径。
于是网上查解决方案,查到两种,
一种是仅在谷歌浏览器上有效的方式,在input节点里加一个属性 webkitdirectory,就可以实现点击d出选择目录的功能,然后就可以截取目录,此种方式对非空文件夹是可以的实现的,只需监听此input的change事件即可,但如果选择的是空文件夹,就不会触发事件,就无法获取路径,所以这方法不复合我的需求。
另一种是只适用于IE浏览器的方式,即调用IE的activeX控件,为点击按钮绑定事件,然后就可以获取目录,然后到目录调到想要的地方即可,具体实现方式是:
<input id="show">
<button onclick="clickBtn()">点击</button>
function click() {
try {
var Message = "\u8bf7\u9009\u62e9\u6587\u4ef6\u5939" //选择框提示 var Shell = new ActiveXObject("Shell.Application")
var Folder = Shell.BrowseForFolder(0, Message, 64, 17) //起始目录为:我的电脑 纯毁 //var Folder = Shell.BrowseForFolder(0, Message, 0) //起始目录为:桌面 if (Folder != null) {
Folder = Folder.items() // 返回 FolderItems 对象
Folder = Folder.item() // 返回 Folderitem 对象 困姿
Folder = Folder.Path // 返回路径
if (Folder.charAt(Folder.length - 1) != "\\") {
做尺备 Folder = Folder + "\\"
}
document.getElementById('show').value = Folder
return Folder
}
} catch (e) { alert(e.message)}
}
但些方式也有一个问题是,此控件是默认关闭的,需要用户手动启用,并且要把本站点加入可信任站点才行,具体设置过程是:
1. 单击菜单工具->Internet选项->安全->受信任站点->站点->把此网站设为可信站点
2. 在自定义级别->对没有标记为安全的ActiveX控件进行初始化和脚本运行"----"启用"
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)