Question

我使用Bootstrap Datetimepicker设置了多个日历输入：http://eonasdan.github.io/bootstrap-datetimepicker/。

我创建了一个包含一些覆盖的对象：

DatetimepickerDefaults = {
    icons: {
        time: 'fa fa-clock-o',
        date: 'fa fa-calendar',
        up: ' fa fa-angle-up',
        down: 'fa fa-angle-down',
        previous: 'fa fa-angle-left',
        next: 'fa fa-angle-right',
        today: 'fa fa-crosshairs',
        clear: 'fa fa-trash',
        close: 'fa fa-times'
    }
}

我想要应用于所有日历输入。所以现在当我想创建一个插件时，我写道：

$('#datetimepicker1').datetimepicker(DatetimepickerDefaults);

问题是某些输入需要有一些特殊的设置，比如格式：'LT'所以当我启动它们时，我写道：

$('#datetimepicker3').datetimepicker({
    icons: {
        time: 'fa fa-clock-o',
        date: 'fa fa-calendar',
        up: ' fa fa-angle-up',
        down: 'fa fa-angle-down',
        previous: 'fa fa-angle-left',
        next: 'fa fa-angle-right',
        today: 'fa fa-crosshairs',
        clear: 'fa fa-trash',
        close: 'fa fa-times'
    },
    format: 'LT'
});

所以我必须重复这个默认设置。有没有办法让它成为所有插件实例的默认设置？

Answer 1

您可以将其设置为以下函数：

function.DatetimepickerDefaults = function(field, value) {
    var retVal = {
    icons: {
        time: 'fa fa-clock-o',
        date: 'fa fa-calendar',
        up: ' fa fa-angle-up',
        down: 'fa fa-angle-down',
        previous: 'fa fa-angle-left',
        next: 'fa fa-angle-right',
        today: 'fa fa-crosshairs',
        clear: 'fa fa-trash',
        close: 'fa fa-times'
    }};
    if (field) {
        retVal[field] = value;
    }
    return retVal;
}

并使用它：

$('#datetimepicker1').datetimepicker(DatetimepickerDefaults());
$('#datetimepicker2').datetimepicker(DatetimepickerDefaults("format", "LT"));
$('#datetimepicker2').datetimepicker(DatetimepickerDefaults("format", "LT2"));
//And etc...

您可以使用列表获取更多值，我希望这有帮助

Answer 2

这是@webmaster answer的更紧凑，更方便的版本，利用了jQuery.extend()方法。

// defaults
function DatetimepickerDefaults(opts) {
    return $.extend({},{
        sideBySide: true,
        ignoreReadonly: true,
        showClose: true,
        toolbarPlacement: 'top'
    }, opts);
}

// usage
$('#datetimepicker2').datetimepicker(DatetimepickerDefaults({
    sideBySide: false,
    showClear: true
}));

您可以再次提供设置对象，这些设置将合并，并在必要时覆盖默认设置。

如何设置Datetimepicker的默认设置？

2 个答案: