需求描述:点击插入,会让选择,插入的类型,选择之后,点击确定,执行后续的一些操作。先摆效果图。

代码:

//html代码
<style>
#imp{
display: none;
}
</style> <div class="btn-group">
<div class="btn-group">
<button class="btn sbold blue" id="insert" onclick=""><span class="ladda-label">插入</span></button>
</div>
</div>
<div id="imp" style="text-align:center;">
<button class="btn sbold default" id="pz" onclick="insertImg('examFile');" style=" margin-top: 50px" >
<span class="ladda-label">插入图片</span>
</button>
<input type="hidden" value="" id="flag" />
<button class="btn sbold default" id="" onclick="insertMus('excamFile')" style="margin-top: 50px">
<span class="ladda-label">插入音乐</span>
</button>
</div> 
<div class="form-group">
<div>
<input id="examFile" name="examFile" type="file" multiple="multiple"/>
</div>
</div>
//js代码
function initUpload(ctrlName) {
$('#flag').val('1');
$('#flag').text(ctrlName);
}
function pzUpload(ctrlName) {
$('#flag').val('2');
$('#flag').text(ctrlName);
} $("#insert").click(function (fun) {
var id= $("table input[type=checkbox]:checked").val()
    var imp=$('#imp')
if (id != undefined && !id ==''){
var index= layer.open({
title:'请选择插入类型',
type: 1,
area: ['300px', '200px'],
content:imp,
btn: ['确定','返回'],
yes: function (index, layero) {
var ctrlName;
var control;
var url;
var title;
var searchServPath;
if ($('#flag').val() != '') {
if ($('#flag').val() == '1') {
ctrlName = $('#flag').text();
control = $('#' + ctrlName);
url = '/vraxx/exam/upload';
$('#title').text("插入图片")
}
              
$("#examFile").on("filebatchuploadsuccess", function (event, data, previewId, index) {
//
                //
                //
});
layer.close(index);
} else {
layer.msg('请选择插入类型');
}
}
}); } }) 

说明:area可以用百分比值来表示比如说: area['70%', '30%']   另外yes函数可以来写一些业务代码  最后就是 content内容,要注意,现在html中设计好,然后获取到div的节点,就可以展示了

总结:layUI有很多很多更加方便的一些内容,一点一点总结下来,进步ing。

最新文章

  1. linux 项目部署问题
  2. Ubuntu install JDK适合像我的小白
  3. 踏上Salesforce的学习之路(二)
  4. JavaScript 作用域知识点梳理
  5. FineUI第十三天---`列布局
  6. S3C6410嵌入式应用平台构建(五)&mdash;&mdash;linux-3.14.4移植到OK6410-(Nand分区问题)
  7. redis源码笔记(一) —— 从redis的启动到command的分发
  8. 企业BGP网络规划案例(一)
  9. Java虚拟机垃圾收集器
  10. PL\SQL 随学笔记
  11. D3.js force力导向图用指定的字段确定link的source和target,默认是索引
  12. 如何绘制UML图?
  13. 迭代器模式(Iterator)
  14. uri.js的用法事例
  15. openwrt,mjpeg流,wifi摄像头与APP联动,拍照、录像
  16. MongoDB图形化管理工具Toad Mac Edition
  17. Linux jstack分析cpu占用100%
  18. log4j2动态修改日志级别及拓展性使用
  19. iDempiere VS ADempiere
  20. java 下载文件的两种方式和java文件的上传

热门文章

  1. nodejs 搭建本地静态服务器
  2. python面试题整合
  3. 01Design and Analysis Algorithm Using Python-程振波
  4. 指路Reactive Programming
  5. Bellman-Ford&amp;&amp;SPFA
  6. Cucumber语法格式
  7. Linux命令_sed
  8. mysql中整数类型后面的数字,比如int(11),11代表11个字节吗?
  9. OCC上下文设置显示模式
  10. Redux thunk中间件