javascript - 如何使日期选择器日历按钮居中

Question

使用下面的代码将打开日历的自定义按钮添加到 Jquery ui datepicker 小部件。

按钮未与输入字段出现在同一行：

如何向下移动按钮，使其与其他元素出现在同一行？

 setTimeout(function () {
    $(elem).css({ "box-sizing": "border-box", width: "68px" }).datepicker({
        dateFormat: 'dd.mm.yy',
        showOn: 'button',
        changeYear: true,
        changeMonth: true,
        showWeek: true,
        showButtonPanel: true
    })
    .removeClass("ui-corner-all").addClass("ui-corner-left");

    $(elem).next('button.ui-datepicker-trigger').button({
        text: false,
        icons: { primary: 'ui-icon-calculator' }
    }).css({ width: '1em', height: '1em' })
        .removeClass("ui-corner-all").addClass("ui-corner-right")
    .find('span.ui-button-text')
    .css({ padding: '0.1em' })
    .siblings('span.ui-button-icon-primary')
    .css({ marginLeft: "-8.5px", marginTop: "-8.5px" });

}, 100);

Answer 1

尝试将相同的vertical-alignCSS 属性添加到输入和按钮。例如，$(elem).next('button.ui-datepicker-trigger').andSelf().css("verticalAlign", "middle");