layuiformSelects-v4复选框总结等table操作记
1: 此组件是layui 官⽹的扩展组件⾥⾥边的,已经停⽌升级,但样式够⽤了
详细介绍地址
hnzzmsf.github.io/example/example_v4.html
//1.下载formSelects-v4
//然后引⼊formSelects.css
<link rel="stylesheet"href="formSelects-v4.css"/>
//2.模块化使⽤
<script src="layui.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
//全局定义⼀次, 加载formSelects
base: '../src/'//此处路径请⾃⾏处理, 可以使⽤绝对路径
}).extend({
formSelects: 'formSelects-v4'
});
//加载模块
layui.use(['jquery', 'formSelects'], function(){
var formSelects = layui.formSelects;
});
</script>
//3.⾮模块化使⽤
<script src="layui.all.js" type="text/javascript" charset="utf-8"></script>
<script src="formSelects-v4.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
var formSelects = layui.formSelects;
</script>
我使⽤的是⾮模块使⽤
js
layui.use(['form', 'layedit', 'laydate'], function(){
var form = layui.form
,layer = layui.layer
,layedit = layui.layedit
,
laydate = layui.laydate;
// var tableSelect = layui.tableSelect;
var formSelects = layui.formSelects;
//选择类似级联,先选第⼀个,然后获取此点击事件,初始化第⼆个选择框内内容. 红⾊字体内是初始化第⼆个选择框内内容, select1是id local是本地模式,arr 是固定写法 s是数据name 和value数组 ('select(nihaotest)', function(data){
$.ajax({
type: 'get',
url: '/xxx/xxxxxx/xxxxxxxxx',
data: {},
async:false,
dataType: 'json',
success: function (data) {
formSelects.data('select1', 'local', {
arr: s
});
},
error:function(e){
}
});
}
})
html
<div class="layui-input-block">
<select id="nihao" lay-filter="nihaotest" name="xxxx">
<div class="layui-input-block">
<select name="xxx" xm-select="select1" id="xxx" lay-filter="xxx" >
附加: 选择框时间保留到分钟layui下载
elem: '#open_start'
, trigger: 'click'
, type: 'time'
, format: 'HH:mm'
});
,
templet: '<div>{{DateString(d.showTime, "yyyy-MM-dd") }
label⽂字太多导致与控件换⾏的问题
<div class="layui-form" >
table 图⽚放⼤
,{field:'ffPhoto', title: '照⽚', width:200, templet: function(res)
{ if(res.ffPhoto!=null) {
return"<img onclick=\"showBigImage(this)\" src=\"/xxxxx/xxx.aspx?fileguid="+res.ViolationPhoto+"\" width=90 height=90 >" }
else {return"未上传";} }}
//显⽰⼤图⽚显⽰在中⼼位置
function showBigImage(e) {
var x = document.documentElement.clientWidth/4;
var y = document.documentElement.clientHeight/4;
layer.open({
type: 1,
title: false,
closeBtn: 0,
offset:[y+"px",x+"px"],
shadeClose: true, //点击阴影关闭
// area:['auto','auto'],
content: "<img src=" + $(e).attr('src') + " />"
});
}
⼿机端屏幕滚动到底部⾮layui
function goScroll(){
var top=$(document).height();//Math.abs(parseInt($("body").css("gyform")));
$(window).scrollTop(top);
}
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论