改变文件上传input file类型的外观
当我们使用文件上传功能时,<input type="file">,但是外观有点不符合口味,如何解决这个问题?
<input type="file" id="fileInput" style="display:none;">
<input id="img-upload" type="button" onclick="showFileInput()" value="点击上传照片">
<script>
function showFileInput(){
var fileInput=document.getElementById("fileInput");
fileInput.click();
}
</script>
还是用到了input的上传功能,只不过不在点击它,而是通过点击button,从而传递到file,实现间接点击file按钮,功能实现了,下面就可以随意对button修改你想要的样式了
改变文件上传input file类型的外观的更多相关文章
- 基于Metronic的Bootstrap开发框架经验总结(5)--Bootstrap文件上传插件File Input的使用
Bootstrap文件上传插件File Input是一个不错的文件上传控件,但是搜索使用到的案例不多,使用的时候,也是一步一个脚印一样摸着石头过河,这个控件在界面呈现上,叫我之前使用过的Uploadi ...
- Bootstrap文件上传插件File Input的使用
基于Metronic的Bootstrap开发框架经验总结(5)--Bootstrap文件上传插件File Input的使用 Bootstrap文件上传插件File Input是一个不错的文件上传控件, ...
- (转)基于Metronic的Bootstrap开发框架经验总结(5)--Bootstrap文件上传插件File Input的使用
http://www.cnblogs.com/wuhuacong/p/4774396.html Bootstrap文件上传插件File Input是一个不错的文件上传控件,但是搜索使用到的案例不多,使 ...
- DVWA 黑客攻防演练(五)文件上传漏洞 File Upload
说起文件上传漏洞 ,可谓是印象深刻.有次公司的网站突然访问不到了,同事去服务器看了一下.所有 webroot 文件夹下的所有文件都被重命名成其他文件,比如 jsp 文件变成 jsp.s ,以致于路径映 ...
- 多文件上传 input 的multiple 属性
一.上传多张图片并且预览 HTML: <div class="container"> <label>请选择一个图像文件:</label> < ...
- Spring MVC-表单(Form)标签-文件上传(File Upload)示例(转载实践)
以下内容翻译自:https://www.tutorialspoint.com/springmvc/springmvc_upload.htm 说明:示例基于Spring MVC 4.1.6. 以下示例显 ...
- AFNetworking 文件上传Data,File图片,文件等上传
一:AFNetworking的文件上传: 主要几个以下类似 - (BOOL)appendPartWithFileURL:(NSURL *)fileURL name:(NSString *)name e ...
- vuetify | vue | 文件上传组件 | file | upload | form input[type="file"]
今天无聊地写vuecli3听歌的时候,遇到了上传文件到Django的自我需求,然后就到vuetify的表单组件里找upload btn,发现居然没有!!! 顿时惊了个呆,要知道之前用element做操 ...
- 文件上传input type="file"样式美化
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
随机推荐
- Java中获取32位UUID
public class createUUID { public static void main(String[] args) { String uuid = UUID.randomUUID().t ...
- POJ 2480 Longge's problem 欧拉函数—————∑gcd(i, N) 1<=i <=N
Longge's problem Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 6383 Accepted: 2043 ...
- NOIP2017 题解
QAQ--由于没报上名并没能亲自去,自己切一切题聊以慰藉吧-- 可能等到省选的时候我就没有能力再不看题解自己切省选题了--辣鸡HZ毁我青春 D1T1 小凯的疑惑 地球人都会做,懒得写题解了-- D1T ...
- 依赖注入(一)构造函数注入(PHP)
构造函数注入(constructor injection)是依赖注入最常见的形式之一. 由名称可以看出,该技术需要我们把所有依赖显示的体现在构造函数中. 好了,直接上代码: <?php /** ...
- Elixir 学习资源
http://segmentfault.com/blog/lds/1190000002458978
- PHP isset()与empty()的使用区别
PHP的isset()函数 一般用来检测变量是否设置 格式:bool isset ( mixed var [, mixed var [, ...]] ) 功能:检测变量是否设置 返回值: 若变量不存在 ...
- Postman Postman接口测试工具使用简介
Postman接口测试工具使用简介 by:授客 QQ:1033553122 本文主要是对Postman这个接口测试工具的使用做个简单的介绍,仅供参考. 插件安装 1)下载并安装chrome浏览器 2) ...
- Android 通过URL获取网络资源
1.先在AndroidManifest.xml中注册加入访问因特网服务的权限: <uses-permission android:name="android.permission.IN ...
- python中的字符串编码问题——1.理解编码和解码问题
理解编码与解码(python2.7):1)编码 是根据一个想要的编码名称,把一个字符串翻译为其原始字节形式.>>> u_str=u'字符串编码aabbbcccddd'>> ...
- maven Could not find artifact com.** 无法下载原因分析
1.有时候经常莫名其妙的遇到这个问题:比如在idea重新导入一个新项目,或者在原来的空间里面引入一个新项目.去私服里面查看明明是有的,但是就是下载不下来. 结合网上搜的和自己遇到的,总结原因如下: 1 ...