一、固定多个日期
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>test.html</title>
<meta charset="utf-8" />
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="layui/css/layui.css" media="all">
<script src="layui/layui.js"></script>
</head>
<body>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>同时绑定多个</legend>
</fieldset>
<input type="text" class="layui-input starttime" placeholder="yyyy-MM-dd">
<input type="text" class="layui-input starttime" placeholder="yyyy-MM-dd">
<input type="text" class="layui-input starttime" placeholder="yyyy-MM-dd">
<script>
layui.use('laydate', function(){
var laydate = layui.laydate;
//同时绑定多个
lay('.starttime').each(function(){
laydate.render({
elem: this
,trigger: 'click'
});
});
});
</script>
</body>
</html>
二，动态增加日期，需要重新laydate渲染
把这个代码放到事件那里，比如点击的事件那里，就不能放到最底部那里，
//同时绑定多个
layui.use('laydate', function(){
var laydate = layui.laydate;
lay('.starttime').each(function(){
laydate.render({
elem: this
,trigger: 'click'
});
});
});
例子代码说明：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>直播课程管理</title>
<link rel="stylesheet" href="__STATIC__/layui/css/layui.css" media="all">
<script src="__STATIC__/layui/layui.js"></script>
<script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
添加一行、删除一行封装方法///
/**
* 为table指定行添加一行
*
* tab 表id
* row 行数，如：0->第一行 1->第二行 -2->倒数第二行 -1->最后一行
* trHtml 添加行的html代码
*
*/
function addTr(tab, row, trHtml,tbResponse){
//获取table最后一行 $("#tab tr:last")
//获取table第一行 $("#tab tr").eq(0)
//获取table倒数第二行 $("#tab tr").eq(-2)
// var $tr=$("#"+tab+" tr").eq(row);
//var $tr=$("#tab tr").eq(row);
var tr=$("#tab"+tbResponse+" tbody").eq(row);
if(tr.size()==0){
alert("指定的table id或行数不存在！");
return;
}
tr.before(trHtml);
//同时绑定多个
layui.use('laydate', function(){
var laydate = layui.laydate;
lay('.starttime').each(function(){
laydate.render({
elem: this
,trigger: 'click'
});
});
});
}
function delTr(ckb){
//获取选中的复选框，然后循环遍历删除
var ckbs=$("input[name="+ckb+"]:checked");
//var id_id=$("input[name="+ckb+"]:checked").val();
if(ckbs.size()==0){
alert("要删除指定行，需选中要删除的行！");
return;
}
var arr = new Array() ;
ckbs.each(function(){
$(this).parent().parent().remove();
//alert($(this).val());
if(isNaN($(this).val())){
k=0;
}else{
k=1;
}
arr.push($(this).val());
});
// alert(k);
if(k==1){
layer.open({
type: 2,
title: '删除直播课程',
maxmin: true,
shade: 0.6,
area: ['20%', '20%'],
content: '{$_M[url][own_form]}a=do_del_class_course&id='+arr,
//content: id,//网址
end: function(){
// layer.msg('删除成功！');
}
});
}
}
/**
* 全选
*
* allCkb 全选复选框的id
* items 复选框的name
*/
function allCheck(allCkb, items){
$("#"+allCkb).click(function(){
$('[name='+items+']:checkbox').attr("checked", this.checked );
});
}
添加一行、删除一行测试方法///
$(function(){
//全选
allCheck("allCkb", "ckb");
});
function addTr2(tab, row,tbResponse){
var trHtml="<tr align='center'><td><input type='hidden' name='ccid[]' value='a'><input value='b' type='checkbox' name='ckb' lay-skin='primary' ></td><td><input type='text' name='title[]' lay-verify='required' class='layui-input' style='width:100%;' value='' placeholder='标题'></td><td><input type='text' name='starttime[]' lay-verify='required' class='layui-input starttime' style='width:100%;' value='' placeholder='开始时间'></td><td><input type='text' name='classhour[]' class='layui-input' style='width:100%;' value='30' placeholder='课时' lay-verify='required'><input type='hidden' name='bigclass[]' value='"+tbResponse+"'></td><td></td><td></td></tr>";
addTr(tab, row, trHtml,tbResponse);
}
function delTr2(){
delTr('ckb');
}
</script>
</head>
<body style="background-color: #FFFFFF;">
<!-- 你的HTML代码 -->
<!-- 表格 -->
<div class="layui-fluid" style="margin: 20px;">
<fieldset class="layui-elem-field">
<legend>增加/修改章节</legend>
<div class="layui-field-box">
<form class="layui-form layui-form-pane" action="{:url('course_add',['pid'=>$pid,'cid'=>$cid,'id'=>$id])}" method="post">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">标题</label>
<div class="layui-input-inline">
<input name="title" lay-verify="required" autocomplete="off" placeholder="请输入章节标题" class="layui-input" type="text" value="{$c_rs.title}">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">排序</label>
<div class="layui-input-inline">
<input name="sort" lay-verify="required|number" autocomplete="off" placeholder="请输入数字" class="layui-input" type="text" value="{$c_rs.sort}">
</div>
<div class="layui-form-mid layui-word-aux">越大越前</div>
</div>
<div class="layui-inline">
<button class="layui-btn" lay-submit lay-filter="formDemo">{empty name="$id"}增加章{else /}修改章{/empty}</button>
</div>
</div>
</form>
</div>
</fieldset>
<form action="{:url('course_add',['pid'=>$pid,'cid'=>$cid,'id'=>$id])}" method="post">
<div class="layui-collapse">
{volist name="res" id="v"}
<div class="layui-colla-item">
<h2 class="layui-colla-title">{$v.title} <button class="layui-btn layui-btn-primary layui-btn-xs">排序:{$v.sort}</button><a href="{:url('course',['pid'=>$pid,'cid'=>$cid,'id'=>$v.id])}" class="layui-btn layui-btn-normal layui-btn-xs">修改</a></h2>
<div class="layui-colla-content layui-show">
<a href='javascript:;' οnclick="addTr2('tab', -1,{$v.id})" class="layui-btn layui-btn-warm layui-btn-xs"><i class='fa fa-plus-circle'></i>增加直播</a><input name="submit" type="button" value="删除直播" class="layui-btn layui-btn-xs layui-btn-primary" style="margin-right:20px;" οnclick="delTr2()">
<table class="layui-table" id="tab{$v.id}">
<colgroup>
<col width="80">
<col width="300">
<col width="190">
<col width="100">
<col width="190">
<col >
</colgroup>
<thead>
<tr>
<th><input lay-skin="primary" type="checkbox" id="quanxuan{$v.id}" value="{$v.id}" οnclick="isQuanxuan({$v.id})">全选</th>
<th>标题</th>
<th>开始时间</th>
<th>课时(分)</th>
<th>结束时间</th>
<th>直播</th>
</tr>
</thead>
<tbody>
{volist name="v.child" id="v2"}
<tr>
<td><input type='hidden' name='ccid[]' value='{$val2['id']}'><input type='checkbox' value='{$val2['id']}' name='ckb' lay-skin='primary' {$checked}{$checked2}></td>
<td><input type='text' name='title[]' class='layui-input' style='width:100%;' value='{$val2['title']}' placeholder='标题'></td>
<td>{$vl2}<input type='text' name='starttime[]' {$trbgc} class='layui-input' style='width:100%;{$sbc}' value='{$vl}' οnclick="layui.laydate({elem: this, istime: true, format: 'YYYY-MM-DD hh:mm:ss'})"></td>
<td><input type='text' name='classhour[]' class='layui-input' style='width:100%;' value='{$val2['classhour']}' placeholder='课时'></td>
<td>{$val2['endtime']}<input type="hidden" name="bigclass[]" value="{$val['id']}"></td>
<td>{$ebt} {$live1} {$b1} {$b2}</td><!--//直播 lay-id="课程ID|班型ID|章节ID|教师ID|教务ID"-->
</tr>
{/volist}
</tbody>
</table>
</div>
</div>
{/volist}
</div>
<blockquote class="layui-elem-quote" style="margin-top: 10px;">
<button class="layui-btn" lay-submit lay-filter="formDemo">立即保存</button>
</blockquote>
</form>
<script>
//点击全选
// var qx=false;
function isQuanxuan(qxNum){
var qx=$("#quanxuan"+qxNum).prop("checked");
console.log(qx)
if(qx){
$("#tab"+qxNum+" input[type='checkbox']").each(function(){
$(this).prop("checked",true);
})
//qx=false;
}else{
$("#tab"+qxNum+" input[type='checkbox']").each(function(){
$(this).prop("checked",false);
})
//qx=true;
}
}
$(document).on("blur","input",function(){
if($(this).val()!=''){
$(this).parents("tr").children("td").first().children().eq(1).attr("checked",true);
}else{
$(this).parents("tr").children("td").first().children().eq(1).attr("checked",false);
}
})
</script>
<script>
//注意：折叠面板 依赖 element 模块，否则无法进行功能性操作
layui.use(['layer', 'form','element','laydate'], function(){
var element = layui.element,
$ = layui.jquery,
laydate = layui.laydate,
form = layui.form,
layer = layui.layer;
//观看直播
$(document).on("click",".look_live",function(){
var id = $(this).attr("lay-id");
var strs= new Array(); //定义一数组
strs=id.split("-"); //字符分割
id0= strs[0];
id1= strs[1];
id2= strs[2];
id3= strs[3];
id4= strs[4];
layer.ready(function(){
layer.open({
type: 2,
title: '直播',
maxmin: true,
shade: 0.6,
area: ['90%', '95%'],
content: '{$_M[url][own_form]}a=do_look_live&pid='+id0+'&cid='+id1+'&ccid='+id2+'&teachers_id='+id3+'&jiaowu_user_id='+id4,
//content: id,//网址
end: function(){
//self.location='{$_M[url][own_form]}a=do_view_course_12&id={$id}';
}
});
});
});
//观看日志
$(document).on("click",".viewlog",function(){
var id = $(this).attr("lay-id");
var strs= new Array(); //定义一数组
strs=id.split("-"); //字符分割
id0= strs[0];
id1= strs[1];
id2= strs[2];
layer.ready(function(){
layer.open({
type: 2,
title: '观看日志',
maxmin: true,
shade: 0.6,
area: ['90%', '95%'],
content: '{$_M[url][own_form]}a=do_look_live_log&pid='+id0+'&cid='+id1+'&ccid='+id2,
//content: id,//网址
end: function(){
//self.location='{$_M[url][own_form]}a=do_view_course_12&id={$id}';
}
});
});
});
//观看回放
$(document).on("click",".look_video",function(){
var id = $(this).attr("lay-id");
var strs= new Array(); //定义一数组
strs=id.split("-"); //字符分割
id0= strs[0];
id1= strs[1];
id2= strs[2];
layer.ready(function(){
layer.open({
type: 2,
title: '观看回放',
maxmin: true,
shade: 0.6,
area: ['90%', '95%'],
content: '{$_M[url][own_form]}a=do_look_video&pid='+id0+'&cid='+id1+'&ccid='+id2,
//content: id,//网址
end: function(){
//self.location='{$_M[url][own_form]}a=do_view_course_12&id={$id}';
}
});
});
});
//上传资料
$(document).on("click",".add_file",function(){
var id = $(this).attr("lay-id");
var strs= new Array(); //定义一数组
strs=id.split("-"); //字符分割
id0= strs[0];
id1= strs[1];
id2= strs[2];
layer.ready(function(){
layer.open({
type: 2,
title: '上传资料',
maxmin: true,
shade: 0.6,
area: ['90%', '95%'],
content: '{$_M[url][own_form]}a=do_add_file&pid='+id0+'&ccid1='+id1+'&ccid2='+id2,
});
});
});
//题库
$(".view_examination").on("click",function(){
var id = $(this).attr("lay-id");
var strs= new Array(); //定义一数组
strs=id.split("|"); //字符分割
id1= strs[0];
id2= strs[1]
layer.ready(function(){
layer.open({
type: 2,
title: '添加练习、考试、作业、考点等试卷',
maxmin: true,
shade: 0.6,
area: ['80%', '90%'],
content: '/admin/index.php?lang=cn&anyid=44&n=examination&c=examination&a=do_choice_test&eid_arr='+id2+'&id='+id1,
end: function(){
// self.location='{$_M[url][own_form]}a=do_view_course_a&id0={$id0}&id1={$id1}&id2={$id2}&id3={$id3}&id4={$id4}';
}
});
});
//layer.msg('{$dfs}');
});
{notempty name="$turnovertext"}
layer.msg('{$turnovertext}');
{/notempty}
});
</script>
</div>
</body>
</html>
重点：
不要放到这里：
