Bootstrap DateTimePicker-如何为今天按钮使用文本“今天”?

时间:2019-02-14 17:42:25

标签: twitter-bootstrap datetimepicker bootstrap-datetimepicker

我已经看到一些日期选择器版本,其中日历下的“今天”按钮/栏显示为“今天”。我的日历图标。

我不想重新加载其他版本,因为我所拥有的实际上正在工作,但是我担心最终用户不一定知道/假设该按钮的意思是“今天”。

在日期时间选择器的.js中,它为“今天”按钮选择了glyphicon日历。如果我禁用了该特定设置,则日历下方的栏中将不会显示任何内容。

        icons: {
        time: "glyphicon glyphicon-time",
        date: "glyphicon glyphicon-calendar",
        up: "glyphicon glyphicon-chevron-up",
        down: "glyphicon glyphicon-chevron-down",
        previous: "glyphicon glyphicon-chevron-left",
        next: "glyphicon glyphicon-chevron-right",
        today: "glyphicon glyphicon-calendar",
        clear: "glyphicon glyphicon-trash",
        close: "glyphicon glyphicon-remove"
    },

我可以使用什么开关,设置或图标来使按钮显示“今天”一词?

1 个答案:

答案 0 :(得分:0)

好的,我知道了。

我创建了一个蓝色矩形的png图像,中间带有一个白色的“今天”。我进入datetimepicker.css并创建了一个引用图像的类-

.calendar-today-button {
background-image: url(../../images/todaybtn.png);
background-repeat: no-repeat;
background-position: center;

}

我在JavaScript代码中找到了该函数,该函数在构造“今日”按钮的按钮/控件时调用了图标类-

F = function() {
            var b = [];
            return d.showTodayButton && b.push(a("<td>").append(a("<a>").attr({
                "data-action": "today",
                title: d.tooltips.today
            }).append(a("<span>").addClass("d.icons.time")))), !d.sideBySide && B() && A() && b.push(a("<td>").append(a("<a>").attr({
                "data-action": "togglePicker",
                title: d.tooltips.selectTime
            }).append(a("<span>").addClass(d.icons.time)))), d.showClear && b.push(a("<td>").append(a("<a>").attr({
                "data-action": "clear",
                title: d.tooltips.clear
            }).append(a("<span>").addClass(d.icons.clear)))), d.showClose && b.push(a("<td>").append(a("<a>").attr({
                "data-action": "close",
                title: d.tooltips.close
            }).append(a("<span>").addClass(d.icons.close)))), a("<table>").addClass("table-condensed").append(a("<tbody>").append(a("<tr>").append(b)))
        },

我将日历图标更改为我的日历按钮类-

            F = function() {
            var b = [];
            return d.showTodayButton && b.push(a("<td>").append(a("<a>").attr({
                "data-action": "today",
                title: d.tooltips.today
            }).append(a("<span>").addClass("calendar-today-button")))), !d.sideBySide && B() && A() && b.push(a("<td>").append(a("<a>").attr({
                "data-action": "togglePicker",
                title: d.tooltips.selectTime
            }).append(a("<span>").addClass(d.icons.time)))), d.showClear && b.push(a("<td>").append(a("<a>").attr({
                "data-action": "clear",
                title: d.tooltips.clear
            }).append(a("<span>").addClass(d.icons.clear)))), d.showClose && b.push(a("<td>").append(a("<a>").attr({
                "data-action": "close",
                title: d.tooltips.close
            }).append(a("<span>").addClass(d.icons.close)))), a("<table>").addClass("table-condensed").append(a("<tbody>").append(a("<tr>").append(b)))
        },