jquery 年月日时间选择器

zackboys

已于 2023-05-03 12:01:52 修改

阅读量4.1k

点赞数 1

分类专栏： jquery 文章标签： jquery css html5

于 2021-10-18 09:55:30 首次发布

本文链接：https://blog.csdn.net/zackboys/article/details/120796650

版权

jquery年月日时间选择器
用地址选择器改的原理一样
我用的rem 样式可能会不一样
在这里插入图片描述

<input class="time" name="time" value="" placeholder="请选择日期">


//js添加地址选择器
var text=`  <div class="pickTime" style="display:none">
                <div class="pickTime_title">
                <a href="javascript:void(0)" class="record">取消</a>
                <div>请选择</div>
                <a href="javascript:void(0)" class="confirm">确认</a>
                </div>
                <div class="pickTime_cen">
	                <div id="province">
	                    <div class="mask_bg"></div>
	                    <div class="mask_pick"></div>
	                    <div class="timeList"></div>
	                </div>
	                <div id="city">
	                    <div class="mask_bg"></div>
	                    <div class="mask_pick"></div>
	                    <div class="timeList"></div>
	                </div>
	                <div id="county">
	                    <div class="mask_bg"></div>
	                    <div class="mask_pick"></div>
	                    <div class="timeList"></div>
	                </div>
                </div>
            </div>
            `
$('body').append(text)
var year_name,month_name,day_name,rowHigh,startY,endY,Y,ind;
// 当前时间
var date= new Date()
// 获取高度计算
rowHigh=$('body .pickTime_title').outerHeight()
// 循环年
for(i=1900;i<=date.getFullYear();i++){
   
    var div=document.createElement('div')
    i=i<10?'0'+i:i
    div.setAttribute('data-id',i)
    div.innerHTML=i+'年';
    $('.timeList').eq(0).append(div);
}
// 循环月
for(var i=1;i<=12;i++){
   
    var div=document.createElement('div')
    i=i<10?'0'+i:i
    div.setAttribute('data-id',i)
    div.innerHTML=i+'月'
    $('.timeList').eq(1).append(div);
}
// 循环日
function day(y,m) {
   
  $('.timeList').eq(2).empty()
  var day;
  if(m==1||m==3||m==5||m==7||m==8||m==10||m==12){
   
    day=31
  }else if(m==4||m==6||m==9||m==11){
   
    day=30
  }else{
   
      if(y%4==0 && y%100</