首页 前端知识 JavaScript 打开本地文件夹的N种方法

JavaScript 打开本地文件夹的N种方法

2024-03-08 10:03:47 前端知识 前端哥 815 197 我要收藏

方法一
通过ActiveXObject对象
比如打开C盘:

function openFileIIs(filename){
var obj=new ActiveXObject("wscript.shell");
if(obj){
obj.Run("\""+filename+"\"", 1, false );
//obj.run("osk");/*打开屏幕键盘*/
//obj.Run('"'+filename+'"');
obj=null;
}
}
复制

方法二
设置一个不可见的input标签,通过input上面的webkitdirectory 属性打开本地文件,我写的是vue3用法:

<div class=" button-common" @click="importFile()">导入
<input v-show="false"
ref="inputFile"
id="file"
type="file"
webkitdirectory
/>
</div>
复制
export default {
...
setup(){
//手动给input绑定事件
function importFile()
this.$refs.inputFile.dispatchEvent(new MouseEvent('click'))
}
return{
importFile
}
}
}
复制

方法三
设置一个不可见的input标签,通过input上面的multiple 属性打开本地文件,我写的是vue3用法:这个属性与webkitdirectory 的具体区别可以百度看看

<div class="import-btn button-common" @click="importStudy()"导入
<input type="file" ref="file" multiple="multiple" @change="onInputFileChange"
/>
</div>
复制
export default {
...
setup(){
//手动给input绑定事件
function importFile()
this.$refs.inputFile.dispatchEvent(new MouseEvent('click'))
}
return{
importFile
}
}
}
复制

方法四
给自己定义的按钮添加下面代码,通过创建一个不可见的input标签实现

<div class=" button-common" @click="importFile()">导入</div>
复制
function importFile() {
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 ;
}
复制
转载请注明出处或者链接地址:https://www.qianduange.cn//article/3421.html
标签
typescript
评论
还可以输入200
共0条数据,当前/页
发布的文章

JQuery对象操作

2024-04-01 10:04:46

jQuery 事件

2024-04-01 10:04:28

jQuery实现二级菜单

2024-04-01 10:04:16

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!