javascript - FullCalendar 自定义按钮图标未显示

标签 javascript jquery fullcalendar

      $('#calendar').fullCalendar({
         header: {
                    left: /*'prev,next'*/'BackwardButton,ForwardButton',
                    center: 'title',
                    right: '',
                },             
                customButtons: {                    
                    ForwardButton: {
                        //text: 'Framåt',
                        click: function () {
                        
                        }
                    },
                    BackwardButton: {
                        //text: 'Bakåt',
                        click: function () {
                         
                            



                        }
                    }
                },
                                buttonsIcons: {
                    BackwardButton: 'left-single-arrow',
                    ForwardButton: 'right-single-arrow',
                },
      
      });
<link href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.9.0/fullcalendar.css" rel="stylesheet"/>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.0/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.9.0/fullcalendar.js"></script>



<div id="calendar"></div>

我正在使用 FullCalender.io .我有两个自定义按钮,我想向其添加默认的人字形或箭头。我找到了这些 properties ,但我不知道应该把它放在完整日历初始化的什么位置。到目前为止没有任何效果。我只得到文本“未定义”。有人有什么想法吗?

      jQuery('#calendar').fullCalendar({
            header: {
                left: 'BackwardButton,ForwardButton',
                center: 'title',
                right: '',
            },             
            customButtons: {                    
                ForwardButton: {
                    //text: 'Framåt',
                    click: function () {

                    }
                },
                BackwardButton: {
                    //text: 'Bakåt',
                    click: function () {

                }
            },
            buttonsIcons: {
                BackwardButton: 'left-single-arrow',
                ForwardButton: 'right-single-arrow',
            }
        });

最佳答案

编辑:下面的代码有效,但是 OP 的代码是正确的,除非有错字(应该是 buttonIcons 而不是 buttonsIcons)。请在此处查看@ADyson 的 JSFiddle:http://jsfiddle.net/sbxpv25p/510/

原文:

我认为这可能是您想要的:https://codepen.io/anon/pen/KoLZXq

看起来您试图将图标添加到错误的位置:

$("#calendar").fullCalendar({
    header: {
        left: "BackwardButton, ForwardButton",
        center: "title"
    },
    customButtons: {
        ForwardButton: {
            icon: "right-single-arrow",
            click: function() {}
        },
        BackwardButton: {
            icon: "left-single-arrow",
            click: function() {}
        }
    }
})

请注意现在每个按钮如何具有 icon 属性。

关于javascript - FullCalendar 自定义按钮图标未显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49813087/

相关文章:

jQuery 在页面加载时播放 iframe 嵌入式 YouTube 视频

AngularJs - 获取函数的返回值

javascript - "this instanceof fNOP ? this"在做什么?

javascript - 在 jQuery 中将年、月和日转换为单个日期

javascript - jQuery position().top 与固定父级中的 offset().top 行为相同

javascript - 删除自执行匿名函数

php - 通过 PHP/MySQL 在 FullCalendar 中实现重复事件的最佳方法是什么?

jquery - 设置在完整日历中显示的初始时间

javascript - jQuery 不工作,但 document.querySelector 可以 (CasperJS)

javascript - Photoshop 脚本 - 获取组/图层集中可见图层的名称