jQuery Datepicker – 只显示日和月份

在本文中，我们将介绍如何使用jQuery Datepicker插件来实现只显示日和月份的功能。

什么是jQuery Datepicker

jQuery Datepicker是一个功能强大且易于使用的日期选择器插件。它允许用户通过一个弹出式日历选择日期，同时还可以根据需求进行自定义设置。

只显示日和月份

有时候，我们只需要选择日期的日和月份，而不需要年份的信息。在这种情况下，我们可以使用jQuery Datepicker插件的dateFormat选项来实现只显示日和月份的效果。

下面是一个例子，演示了如何将日期选择器配置为只显示日和月份：

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" />
</head>
<body>

    <input type="text" id="datepicker" />

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script>
     $(document).ready(function() {$ ("#datepicker").datepicker({
            dateFormat: "dd-mm",
            changeMonth: true,
            changeYear: false,
            showButtonPanel: true,
            onClose: function(dateText, inst) {
                $(this).datepicker('setDate', new Date(null, dateText.split("-")[1], dateText.split("-")[0]));
            }
        });
    });
</script>

</body>
</html>

在上面的代码中，我们通过将dateFormat选项设置为"dd-mm"，来指定日期的显示格式为日和月份。同时，我们还将changeMonth选项设置为true，以允许用户选择月份，而将changeYear选项设置为false，以禁止用户选择年份。

此外，我们将showButtonPanel选项设置为true，以显示一个包含按钮的面板，用于关闭日期选择器。当用户选择日期后，我们使用onClose回调函数将选定的日期设置回输入框中。