ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

javascript-Fullcalendar(v2.x)从eventClick获取日单元吗?

2019-10-28 19:35:55  阅读:229  来源: 互联网

标签:fullcalendar events javascript


我正在努力获取点击多天(期间)事件(eventClick)时所点击的日期.

点击背景单元格,很简单:

function dayClick(date, jsEvent, view) {         

   //todo: store related day
   $scope.selectedDay = date;
}

但是,当单击某个事件(为期数天)时,我无法检索到用户确切在哪一天. (我需要根据背景天执行其他操作):

function alertEventOnClick(event, jsEvent, view) {

            // "event" stores only start and end date without any reference to the current day
            // "jsEvent" retrieve the "td" element but fullcalendar HTML structure is complex and it's impossible to go-up to find the day-cell
            // $scope.selectedDay = ??
        };

我尝试玩“ selectable”,但“ eventClick” JS事件不会传播,也不会“选择”当天

谢谢

解决方法:

如果您根本不需要捕获事件点击,则只需将一个类添加到具有指针事件的所有事件即可:

JSFiddle Demo

eventRender: function (event, element) {
    $(element).addClass('clickThrough');
},

IE8

eh有一种破解指针事件的方法:在IE8上,但是在尝试实现它时,我发现了实现目标的更简单方法. (模拟的指针事件黑客描述为here.)

要获取光标处的日期:

>隐藏事件表
>在光标下获取元素
>显示事件表

JSFiddle Demo

eventClick: function (calEvent, jsEvent, view) {
    var topLayer = $(jsEvent.currentTarget).closest("tbody");
    topLayer.hide(); //hide the entire event layer (makes it work with multiple events)
    var dayElement = document.elementFromPoint(jsEvent.pageX, jsEvent.pageY); //get the element under the cursor (should be a day cell)
    topLayer.show();
    alert($(dayElement).data("date"));
}

更好的IE8解决方法

(这似乎不起作用)

因此,事实证明锚标记具有更好的指针事件:解决方法. https://stackoverflow.com/a/18118092/728393

您只需将属性disable =“ disabled”添加到< a>可以单击它.

JSFiddle Demo

eventRender: function (event, element) {
    $(element).addClass('clickThrough').attr("disabled","disabled"); //disabled attribute is a IE workaround for pointer-events
},

标签:fullcalendar,events,javascript
来源: https://codeday.me/bug/20191028/1954692.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有