IT博客汇 | Datepicker将选择的日期转化为星期几

Datepicker将选择的日期转化为星期几

小旭旭发表于 2016-12-29 02:14:31

jQuery UI的Datepicker是常见的日期选择组件，可以使用 dateFormat: 'yy-mm-dd',对输入的日期做格式化，这给将这个日期转化为星期几得到的方便。

比如用户选择2016-12-29，我们要获取这个日期是星期几非常方便。直接上代码：

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>jQuery UI Datepicker - Default functionality</title>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
    <link rel="stylesheet" href="https://jqueryui.com/resources/demos/style.css">
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    <script>
    $(function() {
        $.datepicker.regional['zh-CN'] = {
            closeText: '关闭',
            prevText: '<上月',
            nextText: '下月>',
            currentText: '今天',
            monthNames: ['一月', '二月', '三月', '四月', '五月', '六月',
                '七月', '八月', '九月', '十月', '十一月', '十二月'
            ],
            monthNamesShort: ['一', '二', '三', '四', '五', '六',
                '七', '八', '九', '十', '十一', '十二'
            ],
            dayNames: ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'],
            dayNamesShort: ['周日', '周一', '周二', '周三', '周四', '周五', '周六'],
            dayNamesMin: ['日', '一', '二', '三', '四', '五', '六'],
            weekHeader: '周',
            dateFormat: 'yy-mm-dd',
            firstDay: 1,
            isRTL: false,
            showMonthAfterYear: true,
            yearSuffix: '年'
        };
        $.datepicker.setDefaults($.datepicker.regional['zh-CN']);
        // datepicker中文翻译
       
        $(".datepicker").datepicker();
        $(".datepicker").on('change', function() {
            var XingQiJi = new Date($(this).val()).getDay()
            console.log("星期" + XingQiJi);
        });
        // 事件绑定，datepicker输入日期转化为星期几

    });
    </script>
</head>

<body>
    <p>Date:
        <input type="text" class="datepicker">
    </p>
</body>

</html>

本文比较粗略，有其他好方法大家可以留言说说。