0

我目前正在尝试将 qtip2 添加到我的 fullCalendar 窗口中，这样我就可以显示 qtip 并有一个链接/按钮来删除日历上的选定事件，不幸的是我遇到了麻烦。这是我的完整日历的样子：

$('#calendar_main').fullCalendar({
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
            defaultView:'agendaWeek',
            minTime:8,
            height:600,
            maxTime:20,
            editable: true,
            allDaySlot:false,
            theme: true,
            firstDay: 1,
            selectable: true,
               selectHelper: true,

            eventRender: function(event, element) {
               element.qtip({ 
                content: "<a onlick='alert('Remove')> Remove me</a>",
                title: {
                  text: 'RDV',
                       button: false
                }
                },
                position: {
                    at: 'right-bottom'
                },
                show: {
                    solo: true
                },
                hide: false,
                style: 'ui-tooltip-light ui-tooltip-rounded'
               });
            } 
        });

我相信问题出在 qtip 的内容属性中，但不确定为什么这不起作用。在这种情况下，我只是想显示一个警报，但它不起作用（显示 Qtip，但是当我点击“删除我”时，什么也没有发生。一旦我开始工作，我将能够用我自己的 JS 函数将删除我的数据库中的选定事件。

ps：我正在使用 Adob​​e Air，不确定这是否会成为问题。

4

3 回答 3

0

我实际上正在做同样的事情，我可以很好地删除它。我遇到的唯一问题是当事件被销毁时，qtip 会一直存在，因此遇到了 eventDestroy 永远不会被调用的问题。

无论如何，我调用 calendarEventRender：

        $('#calendar').fullCalendar({
            firstDay: 1,
            header: {
                left: '',
                center: '',
                right: ''
            },
            defaultView: 'agendaWeek',
            allDaySlot: false,
            columnFormat: {
              week: 'ddd'
            },
            selectable: true,
            selectHelper: true,
            editable: true,
            droppable: true,
            eventRender: function(event, element) {
                calendarEventRender(event, element);
            }
        });

这是我的功能：

function calendarEventRender(event, element)
{
    element.qtip({
        content: {
            title: { text: event.title },
            text: '<button type="button" onclick="removeEvent(' + event.id + ')">Delete</button>'
        },
        show: {
            event: 'click',
            solo: true
        },
        hide: {
            event: 'unfocus click'
        }
    });
}

function removeEvent(eventId, userId)
{    
    //Delete the event
    $('#calendar').fullCalendar('removeEvents', eventId);
}

这一切似乎都奏效了。我没有时间浏览并获取您的代码，但希望这会有所帮助。同样在未来，如果你能得到一个http://jsfiddle.net/不工作的人可以更容易地测试和修复它。

嗯，所以我创建了一个 jsfiddle 来测试它：http: //jsfiddle.net/MusicMonkey5555/pZdyt/1/ 它似乎在那里不起作用。我的猜测是它是 jquery 或 qtip 或 fullcalendar 版本。这是 jsfiddle 的一个问题是获取所有内容的正确版本。我在我的网站上工作的内容如下：

//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js
//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js
//ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/themes/base/jquery-ui.css
//cdnjs.cloudflare.com/ajax/libs/fullcalendar/1.6.4/fullcalendar.min.js
//cdnjs.cloudflare.com/ajax/libs/fullcalendar/1.6.4/fullcalendar.css
//cdnjs.cloudflare.com/ajax/libs/fullcalendar/1.6.4/fullcalendar.print.css
//cdnjs.cloudflare.com/ajax/libs/qtip2/2.1.1/jquery.qtip.min.js
//cdnjs.cloudflare.com/ajax/libs/qtip2/2.1.1/jquery.qtip.min.css

所以我建议尝试使用这些版本，看看它是否有效。大多数情况下是因为 jquery 有一个错误，你需要一个不同的版本。

于 2013-10-09T17:48:10.197 回答
0

可能因为您正在使用 qTip 的调用程序，但实际上您正在使用 qTip2。在真实（源脚本）旧版本 qTip 1.00xxx 中使用，一切都会好起来的 - 我确实做到了。

于 2012-02-25T09:35:43.417 回答
0

一方面，您需要转义单引号以形成警报中的字符串。

其次，您忘记在标签中使用单引号关闭警报。希望能帮助到你...

'<a onlick="alert(\'Remove\');"> Remove me</a>'

这就是它应该的样子。

于 2012-02-23T17:19:32.327 回答