<style>
.ui-datepicker table{
    display: none;
}

<script type="text/javascript">
$(function() {
    $( "#manad" ).datepicker({
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,
        dateFormat: 'yy-mm',
        onClose: function(dateText, inst) { 
            var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
            var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
            $(this).datepicker('setDate', new Date(year, month, 1));
        },
        beforeShow : function(input, inst) {
            if ((datestr = $(this).val()).length > 0) {
                actDate = datestr.split('-');
                year = actDate[0];
                month = actDate[1]-1;
                $(this).datepicker('option', 'defaultDate', new Date(year, month));
                $(this).datepicker('setDate', new Date(year, month));
            }
        }
    });
});

这将解决问题=)但我想要的timeFormat yyyy-mm

不过只在FF4中尝试过

事情是这样的。截至2021年12月

$('.monthpicker').datepicker({
    autoclose: true,
    showButtonPanel: true,
    viewMode: "months",
    minViewMode: "months",
    format: "M-yyyy"
})

如果你想保持当前月份的选择，然后添加

$('.monthpicker').datepicker({
    autoclose: true,
    showButtonPanel: true,
    viewMode: "months",
    minViewMode: "months",
    format: "M-yyyy"
}).datepicker('setDate', new Date());

以上答案都很不错。我唯一的抱怨是，一旦设置了值，就不能清除它。另外，我更喜欢像插件一样扩展jquery的方法。

这对我来说非常合适:

$.fn.monthYearPicker = function(options) {
    options = $.extend({
        dateFormat: "MM yy",
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,
        showAnim: ""
    }, options);
    function hideDaysFromCalendar() {
        var thisCalendar = $(this);
        $('.ui-datepicker-calendar').detach();
        // Also fix the click event on the Done button.
        $('.ui-datepicker-close').unbind("click").click(function() {
            var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
            var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
            thisCalendar.datepicker('setDate', new Date(year, month, 1));
        });
    }
    $(this).datepicker(options).focus(hideDaysFromCalendar);
}

然后像这样调用:

$('input.monthYearPicker').monthYearPicker();

的事: http://www.mattkruse.com/javascript/calendarpopup/

选择月-选择示例

使用onSelect回调并手动删除年份部分，并手动设置字段中的文本

对上面BrianS近乎完美的回答做了一些改进:

我对显示的值集进行了regexed，因为我认为在这种情况下，它实际上使它更具可读性(尽管注意，我使用的格式略有不同) 我的客户不想要日历，所以我添加了一个显示/隐藏类，在不影响任何其他日期选择器的情况下做到这一点。类的删除是在一个定时器上，以避免表在日期选择器淡出时闪回，这在IE中似乎非常明显。

编辑:剩下要解决的一个问题是没有办法清空datepicker -清除字段并单击离开，它重新填充所选的日期。

EDIT2:我还没有设法很好地解决这个问题(即没有在输入旁边添加一个单独的清除按钮)，所以最终只使用这个:https://github.com/thebrowser/jquery.ui.monthpicker -如果有人能得到标准的UI一个来做这件事，那将是惊人的。

    $('.typeof__monthpicker').datepicker({
        dateFormat: 'mm/yy',
        showButtonPanel:true,
        beforeShow: 
            function(input, dpicker)
            {                           
                if(/^(\d\d)\/(\d\d\d\d)$/.exec($(this).val()))
                {
                    var d = new Date(RegExp.$2, parseInt(RegExp.$1, 10) - 1, 1);

                    $(this).datepicker('option', 'defaultDate', d);
                    $(this).datepicker('setDate', d);
                }

                $('#ui-datepicker-div').addClass('month_only');
            },
        onClose: 
            function(dt, dpicker)
            {
                setTimeout(function() { $('#ui-datepicker-div').removeClass('month_only') }, 250);

                var m = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
                var y = $("#ui-datepicker-div .ui-datepicker-year :selected").val();

                $(this).datepicker('setDate', new Date(y, m, 1));
            }
    });

你还需要这样的样式规则:

#ui-datepicker-div.month_only .ui-datepicker-calendar {
display:none
}