一、选择日期（选择两个日期）

最新推荐文章于 2021-03-27 18:03:58 发布
最新推荐文章于 2021-03-27 18:03:58 发布
阅读量1.2k 收藏
点赞数
分类专栏： JS技巧
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/haibo0668/article/details/51565739
版权

脚本说明:
把如下代码加入<body>区域中
<script language="javascript">


// default settings
var fontFace="verdana";
var fontSize=9;

var titleWidth=90;
var titleMode=1;
var dayWidth=12;
var dayDigits=1;

var titleColor="#cccccc";
var daysColor="#cccccc";
var bodyColor="#ffffff";
var dayColor="#ffffff";
var currentDayColor="#333333";
var footColor="#cccccc";
var borderColor="#333333";

var titleFontColor = "#333333";
var daysFontColor = "#333333";
var dayFontColor = "#333333";
var currentDayFontColor = "#ffffff";
var footFontColor = "#333333";

var calFormat = "yyyy/mm/dd";

var weekDay = 0;
// ------

// codes
var calWidth=200, calHeight=200, calOffsetX=-200, calOffsetY=16;
var calWin=null;
var winX=0, winY=0;
var cal="cal";
var cals=new Array();
var currentCal=null;

var yxMonths=new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December");
var yxDays=new Array("Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday");
var yxLinks=new Array("[close]", "[clear]");

var isOpera=(navigator.userAgent.indexOf("Opera")!=-1)?true:false;
var isOpera5=(navigator.appVersion.indexOf("MSIE 5")!=-1 && navigator.userAgent.indexOf("Opera 5")!=-1)?true:false;
var isOpera6=(navigator.appVersion.indexOf("MSIE 5")!=-1 && navigator.userAgent.indexOf("Opera 6")!=-1)?true:false;
var isN6=(navigator.userAgent.indexOf("Gecko")!=-1);
var isN4=(document.layers)?true:false;
var isMac=(navigator.userAgent.indexOf("Mac")!=-1);
var isIE=(document.all && !isOpera && (!isMac || navigator.appVersion.indexOf("MSIE 4")==-1))?true:false;

if (isN4) {
  fontSize+=2;
}

var span2="</span>";

function span1(tag) {
  return "<span class='"+tag+"'>";
}
function spanx(tag, color) {
  return "."+tag+" { font-family:"+fontFace+"; font-size:"+fontSize+"px; color:"+color+"; }\n";
}

function a1(tag) {
  return "<a class='"+tag+"' href=";
}

function ax(tag, color) {
  return "."+tag+" { text-decoration:none; color:"+color+"; }\n";
}

function calOBJ(name, title, field, form) {
  this.name = name;
  this.title = title;
  this.field = field;
  this.formName = form;
  this.form = null
}

function setFont(font, size) {
  if (font != "") {
    fontFace=font;
  }
  if (size > 0) {
    fontSize=size;

    if (isN4) {
      fontSize+=2;
    }
  }
}

function setWidth(tWidth, tMode, dWidth, dDigits) {
  if (tWidth > 0) {
    titleWidth=tWidth;
  }
  if (tMode == 1 || tMode == 2) {
    titleMode=tMode;
  }
  if (dWidth > 0) {
    dayWidth=dWidth;
  }
  if (dDigits > 0) {
    dayDigits=dDigits;
  }
}

function setColor(tColor, dsColor, bColor, dColor, cdColor, fColor, bdColor) {
  if (tColor != "") {
    titleColor=tColor;
  }
  if (dsColor != "") {
    daysColor=dsColor;
  }
  if (bColor != "") {
    bodyColor=bColor;
  }
  if (dColor != "") {
    dayColor=dColor;
  }
  if (cdColor != "") {
    currentDayColor=cdColor;
  }
  if (fColor != "") {
    footColor=fColor;
  }
  if (bdColor != "") {
    borderColor=bdColor;
  }
}

function setFontColor(tColorFont, dsColorFont, dColorFont, cdColorFont, fColorFont) {
  if (tColorFont != "") {
    titleFontColor=tColorFont;
  }
  if (dsColorFont != "") {
    daysFontColor=dsColorFont;
  }
  if (dColorFont != "") {
    dayFontColor=dColorFont;
  }
  if (cdColorFont != "") {
    currentDayFontColor=cdColorFont;
  }
  if (fColorFont != "") {
    footFontColor=fColorFont;
  }
}

function setFormat(format) {
  calFormat = format;
}

function setSize(width, height, ox, oy) {
  if (width > 0) {
    calWidth=width;
  }
  if (height > 0) {
    calHeight=height;
  }

  calOffsetX=ox;
  calOffsetY=oy;
}

function setWeekDay(wDay) {
  if (wDay == 0 || wDay == 1) {
    weekDay = wDay;
  }
}

function setMonthNames(janName, febName, marName, aprName, mayName, junName, julName, augName, sepName, octName, novName, decName) {
  if (janName != "") {
    yxMonths[0] = janName;
  }
  if (febName != "") {
    yxMonths[1] = febName;
  }
  if (marName != "") {
    yxMonths[2] = marName;
  }
  if (aprName != "") {
    yxMonths[3] = aprName;
  }
  if (mayName != "") {
    yxMonths[4] = mayName;
  }
  if (junName != "") {
    yxMonths[5] = junName;
  }
  if (julName != "") {
    yxMonths[6] = julName;
  }
  if (augName != "") {
    yxMonths[7] = augName;
  }
  if (sepName != "") {
    yxMonths[8] = sepName;
  }
  if (octName != "") {
    yxMonths[9] = octName;
  }
  if (novName != "") {
    yxMonths[10] = novName;
  }
  if (decName != "") {
    yxMonths[11] = decName;
  }
}

function setDayNames(sunName, monName, tueName, wedName, thuName, friName, satName) {
  if (sunName != "") {
    yxDays[0] = sunName;
    yxDays[7] = sunName;
  }
  if (monName != "") {
    yxDays[1] = monName;
  }
  if (tueName != "") {
    yxDays[2] = tueName;
  }
  if (wedName != "") {
    yxDays[3] = wedName;
  }
  if (thuName != "") {
    yxDays[4] = thuName;
  }
  if (friName != "") {
    yxDays[5] = friName;
  }
  if (satName != "") {
    yxDays[6] = satName;
  }
}

function setLinkNames(closeLink, clearLink) {
  if (closeLink != "") {
    yxLinks[0] = closeLink;
  }
  if (clearLink != "") {
    yxLinks[1] = clearLink;
  }
}

function addCalendar(name, title, field, form) {
  cals[cals.length] = new calOBJ(name, title, field, form);
}

function findCalendar(name) {
  for (var i = 0; i < cals.length; i++) {
    if (cals[i].name == name) {
      if (cals[i].form == null) {
        if (cals[i].formName == "") {
          if (document.forms[0]) {
            cals[i].form = document.forms[0];
          }
        }
        else if (document.forms[cals[i].formName]) {
          cals[i].form = document.forms[cals[i].formName];
        }
      }

      return cals[i];
    }
  }

  return null;
}

function getDayName(y,m,d) {
  var wd=new Date(y,m,d);
  return yxDays[wd.getDay()].substring(0,3);
}

function getMonthFromName(m3) {
  for (var i = 0; i < yxMonths.length; i++) {
    if (yxMonths[i].toLowerCase().substring(0,3) == m3.toLowerCase()) {
      return i;
    }
  }

  return 0;
}

function getFormat() {
  var calF = calFormat;

  calF = calF.replace(/\\/g, '\\\\');
  calF = calF.replace(/\//g, '\\\/');
  calF = calF.replace(/\[/g, '\\\[');
  calF = calF.replace(/\]/g, '\\\]');
  calF = calF.replace(/\(/g, '\\\(');
  calF = calF.replace(/\)/g, '\\\)');
  calF = calF.replace(/\{/g, '\\\{');
  calF = calF.replace(/\}/g, '\\\}');
  calF = calF.replace(/\</g, '\\\<');
  calF = calF.replace(/\>/g, '\\\>');
  calF = calF.replace(/\|/g, '\\\|');
  calF = calF.replace(/\*/g, '\\\*');
  calF = calF.replace(/\?/g, '\\\?');
  calF = calF.replace(/\+/g, '\\\+');
  calF = calF.replace(/\^/g, '\\\^');
  calF = calF.replace(/\$/g, '\\\$');

  calF = calF.replace(/dd/i, '\\d\\d');
  calF = calF.replace(/mm/i, '\\d\\d');
  calF = calF.replace(/yyyy/i, '\\d\\d\\d\\d');
  calF = calF.replace(/day/i, '\\w\\w\\w');
  calF = calF.replace(/mon/i, '\\w\\w\\w');

  return new RegExp(calF);
}

function getDateNumbers(date) {
  var y, m, d;

  var yIdx = calFormat.search(/yyyy/i);
  var mIdx = calFormat.search(/mm/i);
  var m3Idx = calFormat.search(/mon/i);
  var dIdx = calFormat.search(/dd/i);

  y=date.substring(yIdx,yIdx+4)-0;
  if (mIdx != -1) {
    m=date.substring(mIdx,mIdx+2)-1;
  }
  else {
    var m = getMonthFromName(date.substring(m3Idx,m3Idx+3));
  }
  d=date.substring(dIdx,dIdx+2)-0;

  return new Array(y,m,d);
}

function hideCal() {
  calWin.close();
  calWin = null;
  window.status = "";
}

function getLeftIE(x,m) {
  var dx=0;
  if (x.tagName=="TD"){
    dx=x.offsetLeft;
  }
  else if (x.tagName=="TABLE") {
    dx=x.offsetLeft;
    if (m) { dx+=(x.cellPadding!=""?parseInt(x.cellPadding):2); m=false; }
  }
  return dx+(x.parentElement.tagName=="BODY"?0:getLeftIE(x.parentElement,m));
}
function getTopIE(x,m) {
  var dy=0;
  if (x.tagName=="TR"){
    dy=x.offsetTop;
  }
  else if (x.tagName=="TABLE") {
    dy=x.offsetTop;
    if (m) { dy+=(x.cellPadding!=""?parseInt(x.cellPadding):2); m=false; }
  }
  return dy+(x.parentElement.tagName=="BODY"?0:getTopIE(x.parentElement,m));
}

function getLeftN4(l) { return l.pageX; }
function getTopN4(l) { return l.pageY; }

function getLeftN6(l) { return l.offsetLeft; }
function getTopN6(l) { return l.offsetTop; }

function lastDay(d) {
  var yy=d.getFullYear(), mm=d.getMonth();
  for (var i=31; i>=28; i--) {
    var nd=new Date(yy,mm,i);
    if (mm == nd.getMonth()) {
      return i;
    }
  }
}

function firstDay(d) {
  var yy=d.getFullYear(), mm=d.getMonth();
  var fd=new Date(yy,mm,1);
  return fd.getDay();
}

function dayDisplay(i) {
  if (dayDigits == 0) {
    return yxDays[i];
  }
  else {
    return yxDays[i].substring(0,dayDigits);
  }
}

function calTitle(d) {
  var yy=d.getFullYear(), mm=yxMonths[d.getMonth()];
  var s;

  if (titleMode == 2) {
    s="<tr align='center' bgcolor='"+titleColor+"'><td colspan='7'>\n<table cellpadding='0' cellspacing='0' border='0'><tr align='center' valign='middle'><td align='right'>"+span1("title")+"<b>"+a1("titlea")+"'javascript:if(window.opener && !window.opener.closed && window.opener.moveYear) window.opener.moveYear(-10)'> &laquo;</a> "+a1("titlea")+"'javascript:if(window.opener && !window.opener.closed && window.opener.moveYear) window.opener.moveYear(-1)'>&#8249; </a></b>"+span2+"</td><td width='"+titleWidth+"'><b>"+span1("title")+yy+span2+"</b></td><td align='left'>"+span1("title")+"<b>"+a1("titlea")+"'javascript:if (window.opener && !window.opener.closed && window.opener.moveYear) window.opener.moveYear(1)'> &#8250;</a> "+a1("titlea")+"'javascript:if (window.opener && !window.opener.closed && window.opener.moveYear) window.opener.moveYear(10)'>&raquo; </a></b>"+span2+"</td></tr><tr align='center' valign='middle'><td align='right'>"+span1("title")+"<b>"+a1("titlea")+"'javascript:if (window.opener && !window.opener.closed && window.opener.prepMonth) window.opener.prepMonth("+d.getMonth()+")'> &#8249; </a></b>"+span2+"</td><td width='"+titleWidth+"'><b>"+span1("title")+mm+span2+"</b></td><td align='left'>"+span1("title")+"<b>"+a1("titlea")+"'javascript:if (window.opener && !window.opener.closed && window.opener.nextMonth) window.opener.nextMonth("+d.getMonth()+")'> &#8250; </a></b>"+span2+"</td></tr></table>\n</td></tr><tr align='center' bgcolor='"+daysColor+"'>";
  }
  else {
    s="<tr align='center' bgcolor='"+titleColor+"'><td colspan='7'>\n<table cellpadding='0' cellspacing='0' border='0'><tr align='center' valign='middle'><td>"+span1("title")+"<b>"+a1("titlea")+"'javascript:if(window.opener && !window.opener.closed && window.opener.moveYear) window.opener.moveYear(-1)'> &laquo;</a> "+a1("titlea")+"'javascript:if (window.opener && !window.opener.closed && window.opener.prepMonth) window.opener.prepMonth("+d.getMonth()+")'>&#8249; </a></b>"+span2+"</td><td width='"+titleWidth+"'><nobr><b>"+span1("title")+mm+" "+yy+span2+"</b></nobr></td><td>"+span1("title")+"<b>"+a1("titlea")+"'javascript:if (window.opener && !window.opener.closed && window.opener.nextMonth) window.opener.nextMonth("+d.getMonth()+")'> &#8250;</a> "+a1("titlea")+"'javascript:if(window.opener && !window.opener.closed && window.opener.moveYear) window.opener.moveYear(1)'>&raquo; </a></b>"+span2+"</td></tr></table>\n</td></tr><tr align='center' bgcolor='"+daysColor+"'>";
  }

  for (var i=weekDay; i<weekDay+7; i++) {
    s+="<td width='"+dayWidth+"'>"+span1("days")+dayDisplay(i)+span2+"</td>";
  }

  s+="</tr>";

  return s;
}

我是高手高手高高手
关注
专栏目录
【elementUI-日期选择器（两个框 限制选择范围、快捷键选择】
JUN416326495的博客
09-06 3577
【代码】【elementUI-日期选择器（两个框 限制选择范围、快捷键选择】
python两个日期差几年_python 计算两个日期相差多少个月
weixin_39846089的博客
12-08 3270
近期，由于业务需要计算两个日期之前相差多少个月。我在网上找了很久，结果发现万能的python，居然没有一个模块计算两个日期的月数，像Java、C#之类的高级语言，都会有(date1-date2).months的现成方法，觉得不可思议。说句实在的，一直觉得python 的日期处理模块真心不好用。哦，对了，别跟我说datetime,calendar,dateutil 这些模块，因为我都试过了，都...
php选择日期
06-12
php选择日期
php option选择日期,日历、日期选择函数（修改下，觉得非常好用）
weixin_33487490的博客
03-27 340
/***jQuery.jSelectDateVersion0.2*jQuery下拉列表选择日期插件**WathonTeam*http://www.wathon.com*http://huacn.cnblogs.com*http://www.cnblogs.com/huacn/archive/2008/01/16/jquery_plugin_jSelectDate.html**...
在php中选择日期怎么表示,PHP中的日期处理方法集锦
weixin_42305163的博客
03-10 279
PHP中的日期处理方法集锦更新时间：2007年01月02日 00:00:00 作者：在Unix中，时间的表示方式为计算从1970年1月1日零时起所过去的秒数，这称为UNIX 时间戳本文包含以下内容：1、得到目前的日期和时间－我们有多少种方式？2、改变日期显示的方式－日期和时间的显示形式3、转换现在的日期为Unix的时间戳值4、改变日期a.增加时间b.减去时间c.找出两日期之间的间...
php日期范围选择器,在日期选择器上设置值 - php
weixin_42538175的博客
03-10 468
我有一个php变量，它保存一个选定的日期。$newDate='07/04/2016';我想在jQuery datepicker上设置此日期。任何人都可以建议一种方法来显示$newDate而不是new Date()$("#datetimepickerFrom").datepicker('setDate', new Date());参考方案初始化日期选择器时，将使用defaultDate选项：$("#...
微擎后台选择日期控件
ycs_0405的专栏
12-13 1189
<div class="form-group"> <label class="col-xs-12 col-sm-3 col-md-2 control-label">服务时间<span style="color:#f00;">*</span></label> <div class="col-sm-9 col-xs-12"> {php ec.
H5日期控件(酒店预定，两个日期选择)
07-13
在这个场景中，我们关注的是一个特别设计的H5日期控件，它特别针对酒店预订流程，允许用户选择两个日期，同时还能计算选定日期之间的天数差。 H5（HTML5）是HTML的最新版本，它引入了许多新的API、元素和功能，提高...
基于wheelView的自定义日期选择器
06-26
当用户滚动某个WheelView时，需要同步更新其他两个WheelView的值，以确保所选的日期始终有效。这通常通过监听WheelView的滚动事件并调用适配器的相应方法来实现。 为了支持拓展，我们可以设计一个抽象的基类或接口...
java swing 时间日期选择控件
06-30
Swing提供了JCalendar和JDatePicker这两个常用的日期选择组件，它们使得用户能够方便地在日历视图中选择日期，或者通过一个文本框和下拉小部件选择日期和时间。 1. **JCalendar**: 这是一个第三方组件，通常由`...
input js选择日期的控件-共用于ASP,JSP,PHP,HTML等
01-16
input js选择日期的控件-共用于ASP,JSP,PHP,HTML等
可以选择两个日期的日历
12-16
在做酒店住宿时可以选择入住和离开的时间,最近四个月的日期都可以选择
一次选择两个日期日历
07-06
类似订房间 选择日期（住店、离店）
简洁漂亮的jquery日期选择控件代码
12-12
简洁漂亮的jquery日期选择控件代码
PHP 日期
冷月醉雪的博客
01-09 320
PHP date() 函数可把时间戳格式化为可读性更好的日期和时间。 时间戳是一个字符序列，表示一定的事件发生的日期/时间。 语法 string date ( string $format [, int $timestamp ] ) 参数： format：必需。规定时间戳的格式。 timestamp：可选。规定时间戳。默认是当前的日期和时间。 PHP Date() - 格式化日期 ...
php时间选择器,日期时间选择器：datetimepicker
weixin_31062139的博客
03-21 1345
准备工作Datetimepicker依赖于jquery和jquery ui，因此，您首先要获取jquery库和jquery ui以及datetimepicker，点击这里下载最新版的datetimepicker在html页面中head中加入以下代码：然后在body建加入一行代码：CSS注意，除了引入jquery ui的样式外，还需额外加入以下样式，用于控制时间控件的外观。.ui-timepicke...
php日期选择代码,PHP时间类完整代码实例
weixin_30193461的博客
03-09 533
开发中，经常用到时间的一些例子，比如昨天，今天，前天，近七天，一周等等。这里整理了一个时间的完整类实例，直接实例化，有需要的可以看看以下直接代码header("Content-type:text/html;Charset=utf-8");class time{private $year;//年private $month;//月private $day;//天private $hour;//小时p...
php地区时间选择与设置
Damys
05-16 3482
php默认时间为欧洲时间（Europe/Berlin），正好相差8个小时 处理方法： 1.一劳永逸的设置,修改php.ini文件，
php时间选择器如何制作,微信小程序如何实现精确的日期时间选择器
weixin_42350470的博客
03-12 182
这篇文章主要介绍了微信小程序如何实现精确的日期时间选择器,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下声明bug：由于此篇博客是在bindcolumnchange事件中做的值的改变处理，因此会出现当你选择时，没有点击确定，直接取消返回后，会发现选择框的值依然改变。造成原因：这一点就是由于在bindcolumnchange事件做的值改变处理造成。处...
实现jQuery日期选择控件：Ext风格版
"这篇教程主要介绍了如何使用jQuery创建一个日期选择控件，虽然功能可能不够全面，但能满足基本需求。文章强调了JavaScript的大小写敏感性，并指出控件存在一些问题，如渲染速度慢、兼容性主要针对IE浏览器。通过...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值