首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >不使用<input type=" file "/>的自定义文件选择器

不使用<input type=" file "/>的自定义文件选择器
EN

Stack Overflow用户
提问于 2013-02-26 10:42:20
回答 2查看 4.2K关注 0票数 2

我正在开发一个基于java (webwork framework)的web应用程序,其中要上传的文件需要首先进行压缩。由于无法通过javascript设置"input type='file'“元素的值,因此我决定采用嵌入式applet的方法。基本上,此小程序压缩选定的文件,然后通过scp将压缩文件上载到服务器。

它工作得很好,但我对网页本身的渲染有一些问题。我在想,如果我可以使用现有的文件选择器,而不是在applet中实现文件选择器。当然不需要输入任何"input type='file'“。

链接到这些现有的自定义web文件选择器将非常感谢。

EN

回答 2

Stack Overflow用户

发布于 2013-02-26 10:52:32

由于安全限制,使用HTML选择文件的唯一方法是在文档中添加<input type=file>。然后用户应该选择一个真正的点击文件。

请注意,javascript能够(在现代浏览器中)读取文件的内容,因此它不应该能够选择任意文件并读取它。

票数 2
EN

Stack Overflow用户

发布于 2013-09-27 21:01:49

这总是有效的。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<div id="input_container" style="width: 0px; height: 0px; overflow: hidden"><input type="file" id="inputfile" /></div>
<div class="button" onclick="upload();">Upload file</div>

和你的脚本

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
function upload(){
 document.getElementById('inputfile').click();
}

你的CSS

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
.button {
   /*button style here*/
}
票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/15086997

复制
相关文章
input+type=file同时支持文件和文件夹
使用的dropzone库,你可以将任意类型的文件拖拽进去上传,如果是目录,则会获取目录内的文件
阿超
2023/06/23
2910
FF下修改美化文件域(input type=file)的样式
该文介绍了如何修改美化文件域(input type=file)在FF下的样式。首先,定义了样式,让文件域看起来更美观。然后,在<form>标签中添加一个input type=file,并设置其class为file。最后,在<style>标签内定义了input的样式。
练小习
2017/12/29
1.1K0
input file读取文件
主要使用readAsDataURL去完成转换base64,如果是文档,也可以用readAsText(file,encoding)去读取。
全栈程序员站长
2022/09/09
2.5K0
vue中使用input file上传文件
刚刚学习前端的时候还是觉得这个东西好难的样子,后来第一家公司由于没有这个需求就没用过,现在这家公司由于要求很完美的组件,我就是用的vue组件vue-image-crop-upload(适用于pc端的比较好的组件),先在这里记录用法下次再去把vue-images-crop-upload这个组件记录下
全栈程序员站长
2022/09/09
1.1K0
input type= file通过ajax 来异步上传
input类型设为file: <label for="img_input"></label> <input id="img_input" type="file"/>
山河木马
2019/03/05
1.5K0
js web上传文件夹,访问文件夹的多有文件 input type=file
运行input上传文件夹需要设置 两个重要属性 webkitdirectory multiple
拿我格子衫来
2022/01/24
5.5K0
js web上传文件夹,访问文件夹的多有文件 input type=file
input = file 实现上传文件
使用input = file实现文件上传功能, 如果点击提交按钮,提交表单并上传选中的文件:
全栈程序员站长
2022/09/13
7.2K0
input = file 实现上传文件
input file获取文件路径
发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/160948.html原文链接:https://javaforall.cn
全栈程序员站长
2022/09/16
6.8K0
微信端input type=file 无法上传图片
<input id="photo" type="file" accept="image/jpeg, image/x-png, image/gif" capture="camera">
山河木马
2019/03/05
5.5K2
让 Android 的 WebView 支持 type 为 file 的 input,同时支持拍照
Android 的 WebView 组件默认是不启用 type 为 file 的 input 的,需要在代码中做一些类似 hack 的编码(因为解决问题的目标对象的方法都是加了@hide注解的)才能召唤神龙。
LeoXu
2018/08/15
1.6K0
input file accept限制文件上传类型
上传文件只允许上传doc、docx、jpg、png、gif和pdf格式的文件,需要在前后端进行双重限制
全栈程序员站长
2022/09/09
6.2K0
input file上传文件改变默认样式
我们知道,在使用到input file上传文件的时候,会出现这样很丑的默认样式,作为前端开发的我们,主要责任就是去优化这些样式,以更美观的方式呈现出来,但是,这个默认样式没有可以去修改的属性,还是比较麻烦的。
王小婷
2019/11/27
2.1K0
Bootstrap File Input,最好用的文件上传组件
本篇介绍如何使用 Bootstrap File Input(最好用的文件上传组件)来进行图片的展示、上传,以及如何在服务器端进行文件保存。
全栈程序员站长
2022/09/06
4.2K0
Bootstrap File Input,最好用的文件上传组件
input file 美化
        <input type='file'>的默认外观实在难看,绝大多数情况都需要对其美化。找了很多资料,目前发现以下方式是最简单的美化方式。
用户2038589
2018/09/06
1.5K0
通过Ajax方式上传文件(input file),使用FormData进行Ajax请求
<div > <input type="file" name="FileUpload" id="FileUpload"> <a class="layui-btn layui-btn-mini" id="btn_uploadimg">上传图片</a> </div> <script type="text/jscript"> $(function () {
纯粹是糖
2018/03/14
6.5K0
input type="file"属性详解,利用capture调用手机摄像头
Value:DOMString 选择文件的路径。DOMString 是UTF-16字符串。由于JavaScript已经使用了这样的字符串,所以DOMString 直接映射到 String。
德顺
2019/11/13
11K0
input type="file"属性详解,利用capture调用手机摄像头
asp.net中通过input file上传文件
<input id=”htmlFile” type=”file” runat=”server” />
全栈程序员站长
2022/09/09
2.1K0
input file样式设置
发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/160952.html原文链接:https://javaforall.cn
全栈程序员站长
2022/09/16
1.9K0
input file样式设置
salesforce零基础学习(八十九)使用 input type=file 以及RemoteAction方式上传附件
在classic环境中,salesforce提供了<apex:inputFile>标签用来实现附件的上传以及内容获取。salesforce 零基础学习(二十四)解析csv格式内容中有类似的使用此标签进行解析附件内容,后台只要声明String类型变量用来存储附件名称,Blob类型变量用来存储附件的内容即可。
Zero-Zhang
2018/10/08
1.5K0
salesforce零基础学习(八十九)使用 input type=file 以及RemoteAction方式上传附件
Angular2里获取(input file)上传文件的内容
最近在用Angular2,需要有一个上传文件的功能,但是又不想用库,所以直接用原生的input file 标签。
Tuzei
2020/03/16
2.6K0

相似问题

如何使用input type=file上传json文件

254

如何使用<input type="file">选择多个文件?

1011

将<input type="file“multiple>文件值传递给单个<input type=”文件“>

10

使用<input type=" File“(而不是forge.file)上传文件

12

Input type = "file“多个|选择多个文件

10
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文