js日历三级联动
直接切入正题
<html>
<head>
<title>年月日三下拉框联动</title>
<meta http-equiv='Content-Type' content='text/html; charset=gb2312'>
</head>
<body>
<form name=form1>
<select name=YYYY onchange="YYYYMM(this.value)">
<option value="">年</option>
</select>
<select name=MM onchange="MMDD(this.value)">
<option value="">月</option>
</select>
<select name=DD>
<option value="">日</option>
</select>
</form>
<script language="JavaScript"><!--
function window.onload()
{
strYYYY = document.form1.YYYY.outerHTML;
strMM = document.form1.MM.outerHTML;
strDD = document.form1.DD.outerHTML;
MonHead = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
//先给年下拉框赋内容
var y = new Date().getFullYear();
var str = strYYYY.substring(0, strYYYY.length - 9);
for (var i = (y); i < (y+30); i++) //以今年为准,后30年
{
str += "<option value='" + i + "'> " + i + "</option>\r\n";
}
document.form1.YYYY.outerHTML = str +"</select>";
//赋月份的下拉框
var str = strMM.substring(0, strMM.length - 9);
for (var i = 1; i < 13; i++)
{
str += "<option value='" + i + "'> " + i + "</option>\r\n";
}
document.form1.MM.outerHTML = str +"</select>";
document.form1.YYYY.value = y;
document.form1.MM.value = new Date().getMonth() + 1;
var n = MonHead[new Date().getMonth()];
if (new Date().getMonth() ==1 && IsPinYear(YYYYvalue)) n++;
writeDay(n); //赋日期下拉框
document.form1.DD.value = new Date().getDate();
}
function YYYYMM(str) //年发生变化时日期发生变化(主要是判断闰平年)
{
var MMvalue = document.form1.MM.options[document.form1.MM.selectedIndex].value;
if (MMvalue == ""){DD.outerHTML = strDD; return;}
var n = MonHead[MMvalue - 1];
if (MMvalue ==2 && IsPinYear(str)) n++;
writeDay(n)
}
function MMDD(str) //月发生变化时日期联动
{
var YYYYvalue = document.form1.YYYY.options[document.form1.YYYY.selectedIndex].value;
if (str == ""){DD.outerHTML = strDD; return;}
var n = MonHead[str - 1];
if (str ==2 && IsPinYear(YYYYvalue)) n++;
writeDay(n)
}
function writeDay(n) //据条件写日期的下拉框
{
var s = strDD.substring(0, strDD.length - 9);
for (var i=1; i<(n+1); i++)
s += "<option value='" + i + "'> " + i + "</option>\r\n";
document.form1.DD.outerHTML = s +"</select>";
}
function IsPinYear(year)//判断是否闰平年
{ return(0 == year%4 && (year%100 !=0 || year%400 == 0))}
//--></script>
</body>
</html>
来自转载!
js日历三级联动的更多相关文章
- QQ JS省市区三级联动
如下图: 首先写一个静态的页面: <!DOCTYPE html> <html> <head> <title>QQ JS省市区三级联动</title ...
- 从QQ网站中提取的纯JS省市区三级联动
在 http://ip.qq.com/ 的网站中有QQ自己的JS省市区三级联动 QQ是使用引用外部JS来实现三级联动的.JS如下:http://ip.qq.com/js/geo.js <!DOC ...
- JS年月日三级联动下拉框日期选择代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 原生JS实现三级联动
代码实现 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF- ...
- MVC图片上传详解 IIS (安装SSL证书后) 实现 HTTP 自动跳转到 HTTPS C#中Enum用法小结 表达式目录树 “村长”教你测试用例 引用provinces.js的三级联动
MVC图片上传详解 MVC图片上传--控制器方法 新建一个控制器命名为File,定义一个Img方法 [HttpPost]public ActionResult Img(HttpPostedFile ...
- JS 省市区三级联动
JS 省市区三级联动: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/ ...
- JS省市区三级联动
不需要访问后台服务器端,不使用Ajax,无刷新,纯JS实现的省市区三级联动. 当省市区数据变动是只需调正js即可. 使用方法: <!DOCTYPE html><html>< ...
- 插件 原生js 省市区 三级联动 源码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 使用腾讯IP分享计划网站中的纯JS省市区三级联动
JS地址:http://ip.qq.com/js/geo.js 实例如下: <!DOCTYPE html> <html> <head> <title>省 ...
随机推荐
- C++ STL IO流 与 Unicode (UTF-16 UTF-8) 的协同工作
09年研究技术的大神真的好多,本文测试有很多错误,更正后发布下(可能与编辑器相关). file.imbue(locale(file.getloc(), new codecvt_utf8<wcha ...
- 技术部突然宣布:JAVA开发人员全部要会接口自动化测试框架
整理了一些Java方面的架构.面试资料(微服务.集群.分布式.中间件等),有需要的小伙伴可以关注公众号[程序员内点事],无套路自行领取 写在前边 用单元测试Junit完全可以满足日常开发自测,为什么还 ...
- Centos7桥接设置网络并使用xrdp+tigervnc实现桌面远程访问
最近用到了虚拟机,之前虚拟机的网络配置使用的NAT配置好了,但是无论怎样设置都无法使用局域网内的其它主机访问虚拟机的服务.经过了一天的折腾,远程主机仍然连接不上虚拟机服务,后来找到原因,NAT连接模式 ...
- Codeforces_451_B
http://codeforces.com/problemset/problem/451/B 取前后第一个不满足条件的位置,逆序,判断. #include<cstdio> #include ...
- NJUPT_Wrj 个人训练实录
9暑假了,开个训练实录,记录自己每天的训练以及补题(仅含个人训练,组队训练另开坑)希望能坚持下去QAQ 7.5日常:BZOJ1607线性筛.1601MST.1602LCA.1606背包.1625背包比 ...
- ELK:收集k8s容器日志最佳实践
简介 关于日志收集这个主题,这已经是第三篇了,为什么一再研究这个课题,因为这个课题实在太重要,而当今优秀的开源解决方案还不是很明朗: 就docker微服务化而言,研发有需求标准输出,也有需求文件输出, ...
- Go语言实现:【剑指offer】翻转单词顺序列
该题目来源于牛客网<剑指offer>专题. 例如,"student. a am I",正确的句子应该是"I am a student." Go语言实 ...
- [MP3]MP3固件持续分享(2019.1.25)
转载自我的博客:https://blog.ljyngup.com/archives/179.html/ 所有的固件到我的博客就可以下载哦 最后更新于2019.2.1 前言 这篇文章会持续更新不同型号的 ...
- CyclicBarrier与CountDownLatch区别
阻塞与唤醒方式的区别 CountDownLatch计数方式 CountDownLatch是减计数.调用await()后线程阻塞.调用countDown()方法后计数减一,当计数为零时,调用await( ...
- Nice to meet you for the first time .Why do I write blog!
他们说我不修边幅,因为他们没看到我对细节的追求,他们说我技术宅,因为他们看不懂我的悲欢,他们说我无趣,是因为她们不知道,我在让世界变得更有趣,我把误解拿来自黑,我用工作承载兴趣,我是程序员,是用代码编 ...