Lấy ngày tháng năm tự động

Trở về

  • 16,559

Việc lấy ngày tháng không phải là việc kho nếu bạn nắng vững một số hàm cơ bản trong javascript.

Lấy ngày tháng năm tự động

Tháng và năm có thể tiến hành lấy độc lập, riêng ngày sẽ được lấy dựa theo tháng và năm.

Html viết:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Học Web Chuẩn</title>
<script src="https://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
//Năm tự động điền vào select
    var seYear = $('#year');
    var date = new Date();
    var cur = date.getFullYear();

    seYear.append('<option value="">-- Year --</option>');
    for (i = cur; i >= 1900; i--) {
        seYear.append('<option value="'+i+'">'+i+'</option>');
    };
    
    //Tháng tự động điền vào select
    var seMonth = $('#month');
    var date = new Date();
    
    var month=new Array();
    month[1]="January";
    month[2]="February";
    month[3]="March";
    month[4]="April";
    month[5]="May";
    month[6]="June";
    month[7]="July";
    month[8]="August";
    month[9]="September";
    month[10]="October";
    month[11]="November";
    month[12]="December";

    seMonth.append('<option value="">-- Month --</option>');
    for (i = 12; i > 0; i--) {
        seMonth.append('<option value="'+i+'">'+month[i]+'</option>');
    };
    
    //Ngày tự động điền vào select
    function dayList(month,year) {
        var day = new Date(year, month, 0);
        return day.getDate();
    }    
    
    $('#year, #month').change(function(){
        //Đoạn code lấy id không viết bằng jQuery để phù hợp với đoạn code bên dưới
        var y = document.getElementById('year');
        var m = document.getElementById('month');
        var d = document.getElementById('day');
        
        var year = y.options[y.selectedIndex].value;
        var month = m.options[m.selectedIndex].value;
        var day = d.options[d.selectedIndex].value;
        if (day == ' ') {
            var days = (year == ' ' || month == ' ')? 31 : dayList(month,year);
            d.options.length = 0;
            d.options[d.options.length] = new Option('-- Day --',' ');
            for (var i = 1; i <= days; i++)
            d.options[d.options.length] = new Option(i,i);
        }
    });
});
</script>
</head>
<body>
<select name="year" id="year" size="1"></select>

<select name="month" id="month" size="1"></select>

<select name="day" id="day" size="1">
<option value=" " selected="selected">-- Day --</option>
</select>
</body>
</html>

Hiển thị trình duyệt:

Download file để thực hành

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.