浅谈layui里的上传控件问题


Posted in Javascript onSeptember 26, 2019

很多时候,项目里都是需要上传功能的,现在就来研究研究,

首先,在html页面引入layui的包,如:

<link rel="stylesheet" href="map/plug-in/scripts/layui/css/layui.css" rel="external nofollow" />

<script type="text/javascript" src="map/plug-in/scripts/layui/lay/dest/layui.all.js" ></script>

接着在html页面写:

<div class="layui-form-item query_inp query_inp2">
<div class="layui-input-inline">
 <input type="file" name="file(queryUpload)" class="layui-upload-file layui-upload-file_chaxun">
</div>
</div>

然后再在js文件里对其渲染:

layui.upload({
 elem: '.layui-upload-file_chaxun',
 url: 'importServlet.do'
 ,title: '请上传TXT文件'
 ,ext: 'txt' //那么,就只会支持这三种格式的上传。注意是用|分割。
 ,success: function(res,input){
 }
 });

在这里需要注意的是,如果你有多个上传控件,你就在class里重新命名一个,然后用 elem这个属性来确定对应的上传控件做对应的事情。

以上这篇浅谈layui里的上传控件问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js传值 判断
Oct 26 Javascript
Javascript 继承机制的实现
Aug 12 Javascript
js获取input标签的输入值实现代码
Aug 05 Javascript
Jquery显示、隐藏元素以及添加删除样式
Aug 09 Javascript
JS(JQuery)操作Array的相关方法介绍
Feb 11 Javascript
可恶的ie8提示缺少id未定义
Mar 20 Javascript
JS获取网页属性包括宽、高等等
Apr 03 Javascript
Javascript中的几种URL编码方法比较
Jan 23 Javascript
基于Swiper实现移动端页面图片轮播效果
Dec 28 Javascript
使用electron将vue-cli项目打包成exe的方法
Sep 29 Javascript
微信小程序学习笔记之文件上传、下载操作图文详解
Mar 29 Javascript
11个Javascript小技巧帮你提升代码质量(小结)
Dec 28 Javascript
layui实现多图片上传并限制上传的图片数量
Sep 26 #Javascript
layui 阻止图片上传的实例(before方法)
Sep 26 #Javascript
layui 上传图片 返回图片地址的方法
Sep 26 #Javascript
vue仿ios列表左划删除
Sep 26 #Javascript
微信小程序 多行文本显示...+显示更多按钮和收起更多按钮功能
Sep 26 #Javascript
vue实现百度搜索功能
Dec 28 #Javascript
vue+element搭建后台小总结 el-dropdown下拉功能
Apr 10 #Javascript
You might like
php 生成Tab键或逗号分隔的CSV
2016/09/24 PHP
PHPCMS手机站伪静态设置详细教程
2017/02/06 PHP
kindeditor 加入七牛云上传的实例讲解
2017/11/12 PHP
使用jQuery的ajax功能实现的RSS Reader 代码
2009/09/03 Javascript
基于jsTree的无限级树JSON数据的转换代码
2010/07/27 Javascript
JS过滤url参数特殊字符的实现方法
2013/12/24 Javascript
JQuery Tips相关(1)----关于$.Ready()
2014/08/14 Javascript
基于OL2实现百度地图ABCD marker的效果
2015/10/01 Javascript
Vue基于NUXT的SSR详解
2017/10/24 Javascript
nodejs爬虫初试superagent和cheerio
2018/03/05 NodeJs
Vue使用localStorage存储数据的方法
2019/05/27 Javascript
vue路由守卫及路由守卫无限循环问题详析
2019/09/05 Javascript
JavaScript代码实现微博批量取消关注功能
2021/02/05 Javascript
[01:04:39]OG vs Mineski 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/18 DOTA
python支持断点续传的多线程下载示例
2014/01/16 Python
python多线程编程中的join函数使用心得
2014/09/02 Python
Linux下使用python自动修改本机网关代码分享
2015/05/21 Python
Python实现命令行通讯录实例教程
2016/08/18 Python
Python中几种导入模块的方式总结
2017/04/27 Python
python中pylint使用方法(pylint代码检查)
2018/04/06 Python
对python list 遍历删除的正确方法详解
2018/06/29 Python
Python批处理更改文件名os.rename的方法
2018/10/26 Python
Python模块 _winreg操作注册表
2020/02/05 Python
更新升级python和pip版本后不生效的问题解决
2020/04/17 Python
TensorFLow 数学运算的示例代码
2020/04/21 Python
Canvas 像素处理之改变透明度的实现代码
2019/01/08 HTML / CSS
英国顶级珠宝品牌之家:John Greed
2018/06/09 全球购物
中专毕业生个人职业生涯规划
2014/02/19 职场文书
预备党员综合考察材料
2014/05/31 职场文书
环保标语大全
2014/06/12 职场文书
2014年行政人事工作总结
2014/12/09 职场文书
考试没考好检讨书
2015/05/06 职场文书
红色故事汇观后感
2015/06/18 职场文书
大学生心理健康教育心得体会
2016/01/12 职场文书
MySQL 8.0 驱动与阿里druid版本兼容问题解决
2021/07/01 MySQL
Vue router配置与使用分析讲解
2022/12/24 Vue.js