js 实现点击加载-删除-排序-去重时间选择
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
</head>
<body>
<label class="layui-form-label">时间修改:</label>
<div class="layui-card-body" >
<div id="card" style='width:400px;height:500px' ></div>
</div>
</body>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script>
var start='2019-01-01';
var end='2019-02-12';
showTime(start,end);
//显示时间
function showTime(start,end){
var dateOnly = dataScope(start,end);
var date=getOnlyDate(dateOnly);
var dateArr=getMaxMinArr(date);
var _html =''
var count = 0;
for ( var i = 0; i <dateArr.length; i++){
_html += "<span class='tag label label-info' style='float:left;margin:2px;' data ='"+dateArr[i]+"'>" +
"<font color='#006400'>"+dateArr[i]+"</font>" +
"<span class='label label-info' data-role='remove'><font color='red'>X</font> <i style='color: mediumvioletred' class='layui-icon layui-icon-close-fill'></i></span></span>";
count++;
}
$("#card").append(_html);
}
//日期删除
$("#card").on("click",'span',function(){
$(this).remove();
})
//时间排序
function getMaxMinArr(array) {
if(Object.prototype.toString.call(array).slice(8,-1) ==='Array'){
for (var i = 1; i < array.length; i++) {
var key = array[i];
var j = i - 1;
while (j >= 0 && array[j] > key) {
array[j + 1] = array[j];
j--;
}
array[j + 1] = key;
}
return array;
}else{
return 'array is not an Array!';
}
}
//时间去重
function getOnlyDate(dateArr) {
var dateNew=[];
dateNew=dateArr;
var span= $('#card').find('.tag');
for (var i= 0; i<span.length; i++) {
var spanTemp = span[i];
var dateName = spanTemp.getAttribute('data');
dateNew.push(dateName);
}
//开始去重
var ret = [];
for (var i = 0; i < dateNew.length; i++) {
if (dateNew.indexOf(dateNew[i]) == i) {
ret.push(dateNew[i]);
}
}
$("span.tag").remove();
return ret;
}
//计算时间差
function dataScope(value1, value2) {
var getDate = function(str) {
var tempDate = new Date();
var list = str.split("-");
tempDate.setFullYear(list[0]);
tempDate.setMonth(list[1] - 1);
tempDate.setDate(list[2]);
return tempDate;
}
var date1 = getDate(value1);
var date2 = getDate(value2);
if (date1 > date2) {
var tempDate = date1;
date1 = date2;
date2 = tempDate;
}
date2.setDate(date2.getDate() + 1);
date1.setDate(date1.getDate() );
var dateArr = [];
var i = 0;
while (!(date1.getFullYear() == date2.getFullYear()
&& date1.getMonth() == date2.getMonth() && date1.getDate() == date2
.getDate())) {
var dayStr =date1.getDate().toString();
if(dayStr.length ==1){
dayStr="0"+dayStr;
}
var m;
if(date1.getMonth()>=9){
m="-"+(date1.getMonth()+1);
}else{
m="-0"+(date1.getMonth()+1);
}
console.log(m)
dateArr[i] = date1.getFullYear() +m + "-" + dayStr;
i++;
date1.setDate(date1.getDate() + 1);
}
return dateArr;
}
</script>
</html>