且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

如何将按钮添加到按钮面板中的 jQuery 日期选择器?

更新时间:2023-11-30 16:14:10

如果您想在滚动月份时保持清除"按钮,请使用 onChangeMonthYear:.

If you want to keep the "clear" button while scrolling through the months, use onChangeMonthYear:.

示例:

$( "#datepicker" ).datepicker({
    showButtonPanel: true,
    beforeShow: function( input ) {
        setTimeout(function() {
            var buttonPane = $( input )
                .datepicker( "widget" )
                .find( ".ui-datepicker-buttonpane" );

            $( "<button>", {
                text: "Clear",
                click: function() {
                //Code to clear your date field (text box, read only field etc.) I had to remove the line below and add custom code here
                    $.datepicker._clearDate( input );
                }
            }).appendTo( buttonPane ).addClass("ui-datepicker-clear ui-state-default ui-priority-primary ui-corner-all");
        }, 1 );
    },
    onChangeMonthYear: function( year, month, instance ) {
        setTimeout(function() {
            var buttonPane = $( instance )
                .datepicker( "widget" )
                .find( ".ui-datepicker-buttonpane" );

            $( "<button>", {
                text: "Clear",
                click: function() {
                //Code to clear your date field (text box, read only field etc.) I had to remove the line below and add custom code here
                    $.datepicker._clearDate( instance.input );
                }
            }).appendTo( buttonPane ).addClass("ui-datepicker-clear ui-state-default ui-priority-primary ui-corner-all");
        }, 1 );
    }
});