js日期联动示例


Posted in Javascript onMay 02, 2014

调试需加入jquery文件

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<script src="jquery.js"></script> 
<script> 
$(function(){ 
$('#year').change(function(){ 
if (ifLeapYear($(this).val())) 
{ 
if ($('#month').val() == 2 && $('#day').children().length == 29) 
{ 
$('#day').append('<option value="29">29</option>'); 
} 
} else 
{ 
if ($('#month').val() == 2 && $('#day').children().length == 30) 
{ 
$('#day :last-child').remove(); 
} 
} 
}); $('#month').change(function(){ 
var thisValue = $(this).val(); 
var dayValue = $('#day').val(); 
var month1 = ['4','6','9','11']; 
$('#day').html('<option value="">-请选择-</option>'); 
var day = ''; 
if (thisValue == '') 
{ 
return false; 
} 
if ($.inArray(thisValue, month1) != -1) 
{ 
day = setDay(30); 
$('#day').append(day); 
} else if ($(this).val() == '2') 
{ 
if ($('#year').val() != '' && ifLeapYear($('#year').val())) 
{ 
day = setDay(29); 
} else 
{ 
day = setDay(28); 
} 
$('#day').append(day); 
} else 
{ 
day = setDay(31); 
$('#day').append(day); 
} 
$('#day').find('option[value='+dayValue+']').attr('selected',true); 
}); 
}) 
function setDay(day) 
{ 
var dayInfo = ''; 
for (var i=1; i<=day; i++) 
{ 
dayInfo += '<option value="' + i +'">' + i+ '</option>'; 
} 
return dayInfo; 
} 
function ifLeapYear(year) 
{ 
if ((year % 4 == 0 && year % 100 != 0) || year % 400 == 0) 
{ 
return true; 
} else 
{ 
return false; 
} 
} 
</script> 
<select id="year"><option value="">-请选择-</option> 
<?php for ($i=1980;$i<2012;$i++){ ?> 
<option value="<?php echo $i ?>"><?php echo $i ?></option> 
<?php } ?> 
</select>年 
<select id="month"><option value="">-请选择-</option> 
<?php for ($i=1;$i<=12;$i++){ ?> 
<option value="<?php echo $i ?>"><?php echo $i ?></option> 
<?php } ?> 
</select>月 
<select id="day"><option value="">-请选择-</option></select>日
Javascript 相关文章推荐
使用dynatrace-ajax跟踪JavaScript的性能
Apr 12 Javascript
Javascript判断对象是否相等实现代码
Mar 18 Javascript
js实现二代身份证号码验证详解
Nov 20 Javascript
JavaScript返回上一页的三种方法及区别介绍
Jul 04 Javascript
javascript DIV实现跟随鼠标移动
Mar 19 Javascript
利用Angularjs中模块ui-route管理状态的方法
Dec 27 Javascript
jQuery中的siblings()是什么意思(推荐)
Dec 29 Javascript
js中小数向上取整数,向下取整数,四舍五入取整数的实现(必看篇)
Feb 13 Javascript
jQuery插件HighCharts实现的2D条状图效果示例【附demo源码下载】
Mar 15 Javascript
实现jquery放大镜的两种方法
Feb 22 jQuery
JavaScript 点击触发复制功能实例详解
Nov 02 Javascript
Vue实现简单的留言板
Oct 23 Javascript
jQuery实现的多选框多级联动插件
May 02 #Javascript
自己使用js/jquery写的一个定制对话框控件
May 02 #Javascript
将form表单中的元素转换成对象的方法适用表单提交
May 02 #Javascript
jQuery简单图表peity.js使用示例
May 02 #Javascript
jsPDF导出pdf示例
May 02 #Javascript
ExtJS4利根据登录后不同的角色分配不同的树形菜单
May 02 #Javascript
ExtJS4给Combobox设置列表中的默认值示例
May 02 #Javascript
You might like
解决了Ajax、MySQL 和 Zend Framework 的乱码问题
2009/03/03 PHP
php动态生成JavaScript代码
2009/03/09 PHP
PHP跨平台获取服务器IP地址自定义函数分享
2014/12/29 PHP
CI框架整合smarty步骤详解
2016/05/19 PHP
PHP简单日历实现方法
2016/07/20 PHP
可输入的下拉框
2006/06/19 Javascript
JS按位非(~)运算符与~~运算符的理解分析
2011/07/31 Javascript
Jquery上传插件 uploadify v3.1使用说明
2012/06/18 Javascript
js实现按钮控制图片360度翻转特效的方法
2015/02/17 Javascript
jquery插件corner实现圆角边框的方法
2015/03/09 Javascript
jQuery unbind 删除绑定事件详解
2016/05/24 Javascript
Bootstrap学习笔记之css样式设计(1)
2016/06/07 Javascript
纯JS实现可拖拽表单的简单实例
2016/09/02 Javascript
ReactNative-JS 调用原生方法实例代码
2016/10/08 Javascript
bootstrap-datetimepicker实现只显示到日期的方法
2016/11/25 Javascript
深入理解vue-loader如何使用
2017/06/06 Javascript
详解vue跨组件通信的几种方法
2017/06/15 Javascript
AngularJs 禁止模板缓存的方法
2017/11/28 Javascript
Angular4集成ng2-file-upload的上传组件
2018/03/14 Javascript
Vue中的v-for循环key属性注意事项小结
2018/08/12 Javascript
如何使用vuex实现兄弟组件通信
2018/11/02 Javascript
说说如何使用Vuex进行状态管理(小结)
2019/04/14 Javascript
js最全的数组的降维5种办法(小结)
2020/04/28 Javascript
[01:13]这,就是刀塔
2014/07/16 DOTA
Python装饰器使用示例及实际应用例子
2015/03/06 Python
详解Python中的__new__()方法的使用
2015/04/09 Python
python 求一个列表中所有元素的乘积实例
2019/06/11 Python
Python中正反斜杠(‘/’和‘\’)的意义与用法
2019/08/12 Python
django template实现定义临时变量,自定义赋值、自增实例
2020/07/12 Python
Python的3种运行方式:命令行窗口、Python解释器、IDLE的实现
2020/10/10 Python
资深生产主管自我评价
2013/09/22 职场文书
简历中的自我评价怎么写
2014/01/29 职场文书
房展策划方案
2014/06/07 职场文书
美容院合作经营协议书
2014/10/10 职场文书
2015年基层党组织公开承诺书
2015/01/21 职场文书
生产实习心得体会范文
2016/01/22 职场文书