input type=file上传控件老问题
// 1.用INPUT控制上传文件时,点击INPUT控件出现文件选择框。
// 2.如果在手机上使用时,一般不会出现这种较丑的
// 3.于是就自然想到将控件隐藏,然后用一个按钮代替,点击按钮时在函数里使用脚本触发INPUT控件的
// 4.结果发现无效,无法使用JS触发INPUT的控件。(在PC端有的浏览器可以,在手机浏览器中有的安卓机可以,苹果机不行)
<form>
<input name="photos" type="file" accept="image/*">
<input name="photos" type="file" accept="image/*" capture="camcorder">
<input name="audios" type="file" accept="image/*" capture="microphone">
</form>
// 5.结果使用网友的办法,将INPUT控件的大小与按钮大小设为一样的,然后将控件的透明度设为0,盖在按钮上.
这样看到的是按钮,但点击的还是INPUT,于是就可以弹出选择框了
// 注意事项
1.提交时要放在表单元素中<form><input type="file" name="name属性一定要有,不然后台拿不到文件"/></form>
2.可以使用jquery.form这个异步表单插件,很好用。
$('#theform').ajaxSubmit({
type:'post',// 表单方式
url:'abx/abz',// 提交地址
data:para,// 参数,可以是一个JSON对象
// 提交成功
success: function (data) {
$('#resultimg').html('成功,已经上传图片。');
},
// 提交失败
error: function (data) {
$('#resultimg').html('出错了,请刷新重试.');
}
});
input type=file上传控件老问题的更多相关文章
- input type='file'上传控件假样式
采用bootstrap框架样式 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> &l ...
- input type=file 上传文件样式美化(转载)
input type=file 上传文件样式美化 来源:https://www.jianshu.com/p/6390595e5a36 在做input文本上传时,由于html原生的上传按钮比较丑,需要对 ...
- Js获取file上传控件的文件路径总结
总结一个获取file上传控件文件路径的方法 firefox由于保护机制只有文件名,不能获取完整路径. document.getElementById('file').onchange = functi ...
- <input type=file>上传唯一控件
值得注意的是:当一个表单里面包含这个上传元素的时候,表单的enctype必须指定为multipart/form-data,method必须指定为post,浏览器才会认识并正确执行.但是还有一点,浏览器 ...
- <input type="file">上传文件并添加路径到数据库
注:这里是用的mvc所以没法用控件 html代码 <form method="post" enctype="multipart/form-data"> ...
- HTML <input type="file">上传文件——结合asp.net的一个文件上传示例
HTML的代码:(关键是要在form里设置enctype="multipart/form-data",这样才能在提交表单时,将文件以二进制流的形式传输到服务器) 一. <fo ...
- input(type='file')上传多张照片并显示,传到后台
以下内容为网络摘抄和实践修改所得,如有雷同,请谅解!!!! 1.首先是前端页面代码: 其中,<input type="file" id="file_input&qu ...
- 判断input[type=file]上传文件格式
input type="file" 在js中判断文件上传类型 function onSubmit(){ var form1 = document.forms[0]; var fil ...
- jquery判断 input type="file"上传文件是否为空
要想获取type="file"的input内容,用var file = $("id").val();肯定是不行的,下面是代码: html上传按钮为: <i ...
随机推荐
- 福州大学软件工程1816 | W班 第7次作业成绩排名
写在前面 汇总成绩排名链接 1.作业链接 第七次作业--项目需求分析(团队) 2.评分准则 本次作业映射总分为100分+贡献度得分,由以下部分组成: 引言(5 points) . 用户场景(15 po ...
- Servlet 使用ServletContext共享数据,读取web.xml配置
ServletContext对象 session和cookie,对于每一个请求用户来说,都是不同的,因为要保证隐私安全. 而有一些数据,可以让所有用户共享,此时就可以用ServletContext对象 ...
- 测试python最大递归层次
转自:https://www.cnblogs.com/xiongdashuai/p/6243372.html python默认的最大递归层数: 运行环境:Windows 7,x64python环境:p ...
- 使用node写一个简单的页面操作
let http = require('http'); let urlStr = require('url'); let fs = require('fs'); let path = require( ...
- springmvc配置文件的主要内容
springmvc配置文件的主要内容:
- Oracle列转行函数LISTAGG()
--Oracle列转行函数LISTAGG() with tb_temp as( select 'China' 国家,'Wuhan' 城市 from dual union all select 'Chi ...
- Partition算法以及其应用详解下(Golang实现)
接前文,除了广泛使用在快速排序中.Partition算法还可以很容易的实现在无序序列中使用O(n)的时间复杂度查找kth(第k大(小)的数). 同样根据二分的思想,每完成一次Partition我们可以 ...
- fiddler 笔记-设置断点
设置断点后,可以修改httprequest的任何信息包括:host,cookie或都表单中的数据 1 Fiddler--rules--Automatic Breakpoint --before Req ...
- 一、VS2017支持Github
选择 工具-->扩展和更新,搜索GitHub,安装GitHub的VS插件 安装完插件,打开视图-->团队资源管理器,我们可以看到Git插件菜单.通过菜单我们可以新建Git存储库,可以提交修 ...
- layui tips