Question

jQuery FullCalendar插件在IE 10及以下版本中引发此qtip错误导致它无法显示：

对象不支持属性或方法＆＃39; qtip＆＃39;

Chrome，Firefox和IE11似乎不会在控制台中抛出此错误。我已经完成了几次谷歌搜索，将其记录为已知问题，但尚未找到具体的解决方案。

有人建议旧的IE版本可能无法完全加载库并添加设置超时功能以使其工作但似乎没有帮助

我按以下顺序在我的页面中包含以下js文件：jquery-1.9.1.js，fullcalendar.min.js，jquery.qtip.min.js以及要包含的必要CSS文件。

此处的qtip函数抛出错误：

var tooltip = $('<div/>').qtip({
            id: 'fullcalendar',
            prerender: true,
            content: {
                text: ' ',
                title: {
                    button: true
                }
            },
            position: {
                my: 'bottom center',
                at: 'top center',
                target: 'mouse',
                viewport: $('#fullcalendar'),
                adjust: {
                    mouse: false,
                    scroll: false
                }
            },
            show: false,
            hide: false,
            style: {
                classes: 'qtip-plain qtip-shadow'
            }
        }).qtip('api');

非常感谢任何建议 - 谢谢！

Answer 1

它适用于我加载以下脚本：

<link rel="stylesheet" href="/fullcalendar/lib/cupertino/jquery-ui.min.css" media="screen" />
<link rel="stylesheet" href="/fullcalendar/fullcalendar.css" media="screen" />
<link type="text/css" rel="stylesheet" href="/qtip/jquery.qtip.css" />

<script src="/jquery-2.1.1.min.js"></script>
<script src="/fullcalendar/lib/moment.min.js"></script>
<script src="/fullcalendar/fullcalendar.min.js"></script>
<script src="/qtip/jquery.qtip.js"></script>

如此配置FullCalendar，在eventRender：

中添加qTip

<script>
jQuery(document).ready( function($) {
    $('#calendar').fullCalendar({
        header: { /* config */ },
        events: function ( start, end, timezone, callback ) { /* config */ },
        eventRender: function ( event, element ) 
        {
            element.qtip({ 
                content: {
                    text: event.title
                },
                position: {
                    target: 'mouse',
                    adjust: { 
                        x: 10, 
                        y: 10, 
                        mouse: false 
                    }
                }
             });
        }
    });
});
</script>

jQuery FullCalendar对象不支持属性或方法qtip

1 个答案: