HTML
<div id="addmb" style="display:none;padding:10px;">
<form class="layui-form layui-form-pane" lay-filter="example">
<div class="layui-form-item">
<label class="layui-form-label">模板介绍</label>
<div class="layui-input-block">
<input type="text" name="title" id="mbjs" autocomplete="off" placeholder="请输入介绍" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">模板类型</label>
<div class="layui-input-block">
<input type="radio" name="roles" value="悬浮窗" title="悬浮窗">
<input type="radio" name="roles" value="微信号样式" title="微信号样式" checked="">
<input type="radio" name="roles" value="底部" title="底部">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">回传方式</label>
<div class="layui-input-block">
<input type="radio" name="hcfs" value="长按回传" title="长按回传" checked="">
<input type="radio" name="hcfs" value="复制回传" title="复制回传">
<input type="radio" name="hcfs" value="单击回传" title="单击回传">
</div>
</div>
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-btn-container">
<button type="button" class="layui-btn layui-btn-normal" id="test8">选择文件</button>
<img style="width:100px;" id="demo1" src="" alt="" />
</div>
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">代码块</label>
<div class="layui-input-block">
<textarea placeholder="请输入模板代码" name="code" class="layui-textarea mbdm" style="margin-top: 0px; margin-bottom: 0px; height: 273px;"></textarea>
</div>
</div>
</form>
<div class="layui-form-item">
<button class="layui-btn" id="doadd">提交</button>
</div>
</div>
JS
<script type="text/javascript">
layui.use(['upload', 'element', 'layer'], function() {
var $ = layui.jquery,
upload = layui.upload,
element = layui.element,
layer = layui.layer;
form = layui.form;
layui.$('#doadd').on('click', function() {
datafo = form.val('example'); //表单val
// alert(JSON.stringify(data));
});
//选完文件后不自动上传
upload.render({
elem: '#test8',
url: '/api/v1.Ymlogin/addmb',
auto: false, //不自动上传
// multiple: true,//多文件上传
bindAction: '#doadd', //手动提交
before: function(obj) {
//文件上传时 附带表单参数
this.data = {
'lx': datafo.roles,
'bt': datafo.title,
'code': datafo.code,
'hc': datafo.hcfs
};
},
//选择文件后预览
choose: function(obj) {
obj.preview(function(index, file, result) {
$('#test8').text('已选择');
$('#demo1').attr('src', result); //图片链接(base64)
});
},
done: function(res) {
layer.msg('上传成功');
setTimeout("layer.closeAll()", "1000");
}
});
});
</script>