Jquery出生日期控件

最新推荐文章于 2024-07-21 02:56:03 发布
iziminy
最新推荐文章于 2024-07-21 02:56:03 发布
阅读量1.8k
点赞数 1
分类专栏： JavaScript jQuery
JavaScript 同时被 2 个专栏收录
41 篇文章 0 订阅
订阅专栏
jQuery
29 篇文章 0 订阅
订阅专栏
<html>
	<head>
	    <script src="jquery-1.4.2.min.js" type="text/javascript"></script>
	    <script type="text/javascript">
	        jQuery.noConflict();
                jQuery(function ($) {
                    var $birthYear = $('.gbiaps_birthday_year');
                    var year = new Date().getFullYear();
                    $('<option value="' + (year - 1) + '" selected="selected" >' + (year - 1) + '</option>').appendTo($birthYear);
                    for (var i = 2; i <= 100; i++) {
                        var y = year - i;
                        $('<option value="' + y + '" >' + y + '</option>').appendTo($birthYear);
                    }
                
                    var $birthMonth = $('.gbiaps_birthday_month');
                    $('<option value="1" selected="selected">1</option>').appendTo($birthMonth);
                    for (var m = 2; m <= 12; m++) {
                        $('<option value="' + m + '">' + m + '</option>').appendTo($birthMonth);
                    }
                
                    var $birthDay = $('.gbiaps_birthday_day');
                    $('<option value="1" selected="selected">1</option> ').appendTo($birthDay);
                    for (var d = 2; d <= 31; d++) {
                        $('<option value="' + d + '" >' + d + '</option> ').appendTo($birthDay);
                    }
                
                    //$birthYear.change(onBirthChange);
                    //$birthMonth.change(onBirthChange);
                    //$birthDay.change(onBirthChange);
                    
                    $birthYear.bind('change',onBirthChange);
                    $birthMonth.bind('change',onBirthChange);
                    $birthDay.bind('change',onBirthChange);
                
                    function onBirthChange() {
                        
                        var year = $birthYear.find('option:selected').val();
                        var month = $birthMonth.find('option:selected').val();
                        var day = $birthDay.find('option:selected').val();
                        
                        switch (month - 0) {
                            case 4:
                            case 6:
                            case 9:
                            case 11:
                                if (day > 30) {
                                    setBirthDate(year, month, 30);
                                }
                                showData(29,'show');
                                showData(30,'show');
                                showData(31,'hide');
                                break;
                            case 2:
                
                                if (!isLeapYear(year)) {
                                    showData(29,'hide');
                                    if (day > 28)
                                        setBirthDate(year, 2, 28);
                                }else{
                                    if (day > 29)
                                        setBirthDate(year, 2, 29);
                                    showData(29,'show');
                                }
                                showData(30,'hide');
                                showData(31,'hide');
                                break;
                            case 1:
                            case 3:
                            case 5:
                            case 7:
                            case 8:
                            case 10:
                            case 12:
                                showData(29,'show');
                                showData(30,'show');
                                showData(31,'show');
                                break;
                        }
                
                    }
                    
                    function showData(i,value){
                        if(value == 'show'){
                            //console.log($birthDay.find('option[value="'+ i +'"]').is('option'));
                            if(!$birthDay.find('option[value="'+ i +'"]').is('option'))
                                $('<option value="' + i + '" >' + i + '</option> ').appendTo($birthDay);
                        }
                        if(value == 'hide'){
                            if($birthDay.find('option[value="'+ i +'"]'))
                                $birthDay.find('option[value="'+ i +'"]').remove();
                        }
                    }
                
                    //setBirthDate(1985, 9, 19);
                    var birthDate = $birthYear.attr('data-birthday').split('-');
                    
                    setBirthDate(parseInt(birthDate[0]), parseInt(birthDate[1]), parseInt(birthDate[2]));
                
                    /**
                  判断year是否闰年
                     */
                    function isLeapYear(year) {
                        return(0 == year % 4 && (year % 100 != 0 || year % 400 == 0));
                }
                
                    function setBirthDate(year, month, day) {
                        $birthYear.val(year);
                        $birthMonth.val(month);
                        $birthDay.val(day);
                    }
                
                });
	    </script>
	</head>
	<body>
	<select class="gbiaps_birthday_year"></select>
	<select class="gbiaps_birthday_month"></select>
	<select class="gbiaps_birthday_day"></select>
	</body>
	</html>