标签:jquery str logs orm val function document disable ext
可实现类似于酒店预订的功能。支持日期多选,日期重复选择取消等功能。
datetimepicker去网上下载 很多, 只需要取到
bootstrap-datetimepicker.min.js
bootstrap-datetimepicker.min.css
两个文件即可
JS:
<link href="css/bootstrap-datetimepicker.min.css" rel="stylesheet" />
<link href="css/bootstrap.min.css" rel="stylesheet" />
<script src="js/jquery-3.0.0.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/bootstrap-datetimepicker.zh-CN.js"></script>
<script src="js/bootstrap-datetimepicker.min.js"></script>
script type="text/javascript">
$(document).ready(function() { var dateList=[]; $("#datetimeStart").datetimepicker({ format: ‘yyyy-mm-dd‘, minView: ‘month‘, language: ‘zh-CN‘, autoclose: true, startDate: [‘2017-03-29‘], datesDisabled:[‘2017-03-30‘], }).on("changeDate", function() { // $("#datetimeStart").datetimepicker("setEndDate", $("#datetimeEnd").val()) alert("11"); var dateClicked = $("#datetimeStart").val(); if(dateList.indexOf(dateClicked)>-1){ alert("位置"+dateList.indexOf(dateClicked)); dateList.splice(dateList.indexOf(dateClicked),1); alert("删除成功"); }else{ dateList.push($("#datetimeStart").val()); alert("222"); }alert("333"); $("#datelist").val(dateList); }); });
</script>
HTML:
<input size="16" type="text" id="datetimeStart" readonly class="form_datetime"> -- <input size="16" type="text" id="datelist" readonly class="form_datetime"/>
bootstrap datetimepicker 复选可删除,可规定指定日期不可选
标签:jquery str logs orm val function document disable ext
原文地址:http://www.cnblogs.com/duyunchao-2261/p/6651980.html