FullCalendar onClick事件打开的对话框中的Android不工作 [英] FullCalendar onClick event open Dialog in Android not working
问题描述
下面是我的code为fullcalendar，我试图在Android的对话框打开日历事件。我尝试了所有的办法和建议，但失败了。任何人都可以提出谁在Android已经尝试过吗？目前，它是在事件的Android的onClick浏览器中打开了，我想在对话框中显示。在此先感谢
＆LT; HTML和GT;
＆LT; HEAD＆GT;
＆LT;脚本的src ='.. / jQuery的/ jQuery的-1.9.1.min.js'＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本的src ='.. / jQuery的/ jQuery的-UI-1.10.2.custom.min.js'＆GT;＆LT; / SCRIPT＆GT;
＆LT; SCRIPT SRC =../的jQuery / jquery.ui.touch-punch.min.js＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本的src ='.. / fullcalendar / fullcalendar.min.js'＆GT;＆LT; / SCRIPT＆GT;
＆LT;链接的href ='.. / fullcalendar / fullcalendar.css相对='样式'/＆GT;
＆LT;链接的href ='.. / fullcalendar / fullcalendar.print.css相对='样式'媒体=打印/＆GT;
＆LT;脚本的src ='.. / fullcalendar / gcal.js'＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本＆GT;$（文件）。就绪（函数（）{ $（'＃日历'）。fullCalendar（{
//美国假期
事件：'http://www.google.com/calendar/feeds/usa__en%40holiday.calendar.google.com/public/basic'，
eventClick：功能（calEvent，jsEvent，视图）{
警报（'事件：'+ calEvent.title）;
警报（'坐标：'+ jsEvent.pageX +'，'+ jsEvent.pageY）;
警报（'景观：'+ view.name）; //只是改变边框颜色为乐趣
$（本）的.css（'边框颜色'，'红'）; }， 加载：函数（布尔）{
如果（布尔）{
$（'＃装载）显示（）。
}其他{
$（'＃装载'）隐藏（）。
}
} }）;}）;＆LT; / SCRIPT＆GT;
＆LT;风格＆GT;身体 {
的margin-top：25px的;
文本对齐：中心;
字体大小：13像素;
FONT-FAMILY：龙力大，黑体，宋体，宋体，无衬线;
}#loading {
位置：绝对的;
上图：5像素;
右：5像素;
字体大小：9px;
}#calendar {
宽度：100％;
保证金：0汽车;
}＆LT; /风格＆GT;
＆LT; /头＆GT;
＆LT;身体GT;
＆LT; DIV ID ='装'风格=显示：无'＆gt;请稍候....数据加载中.....＆LT; / DIV＆GT;
＆LT; DIV ID ='历'＆GT;＆LT; / DIV＆GT;
＆LT; /身体GT;
＆LT; / HTML＆GT;
我碰到了同样的问题，这里是如何绕过它。
问题的产生是因为在亚当肖的最优秀的FullCalendar插件（V1），他是附加的事件处理程序的日历事件懒洋洋的，对事件容器鼠标悬停。问题是，Android不正确地实现鼠标悬停事件，因此点击处理程序没有得到初始化。
一个解决方法是改变code在他的身边，从1707线插件：
container.unbind（'鼠标悬停'）。鼠标悬停（函数（EV）{
到
container.unbind（'点击'）。点击（函数（EV）{
然而，这会要求你点击一个事件来初始化任何其他活动，所以如果你有日历事件悬停事件（我想你不会，因为你在做手机开发），此方法深得'T的工作。
另一种选择，这是我做的，但他击败懒事件初始化，就是添加以下到您的日历初始化选项：
eventAfterAllRender：功能（）{
//砍触发事件在Android上的镀铬结合，这不会触发鼠标悬停事件
$（'FC-事件'）。每个（函数（I，元素）{
$（元素）.trigger（'鼠标悬停'，{}）;
}）
}
这样做是立即触发所有事件鼠标悬停事件日历，从而触发所有日历事件attachHandler。
Here is my code for fullcalendar and i am trying to open calendar events in a dialog in Android. I tried all the ways and suggestions but failed. Can anyone suggest who has tried this in android ? Currently it is opening up in a browser in android onClick of event, i want to show in dialog. Thanks in advance
<html>
<head>
<script src='../jquery/jquery-1.9.1.min.js'></script>
<script src='../jquery/jquery-ui-1.10.2.custom.min.js'></script>
<script src="../jquery/jquery.ui.touch-punch.min.js"></script>
<script src='../fullcalendar/fullcalendar.min.js'></script>
<link href='../fullcalendar/fullcalendar.css' rel='stylesheet' />
<link href='../fullcalendar/fullcalendar.print.css' rel='stylesheet' media='print' />
<script src='../fullcalendar/gcal.js'></script>
<script>
$(document).ready(function() {
$('#calendar').fullCalendar({
// US Holidays
events: 'http://www.google.com/calendar/feeds/usa__en%40holiday.calendar.google.com/public/basic',
eventClick: function(calEvent, jsEvent, view) {
alert('Event: ' + calEvent.title);
alert('Coordinates: ' + jsEvent.pageX + ',' + jsEvent.pageY);
alert('View: ' + view.name);
// change the border color just for fun
$(this).css('border-color', 'red');
},
loading: function(bool) {
if (bool) {
$('#loading').show();
}else{
$('#loading').hide();
}
}
});
});
</script>
<style>
body {
margin-top: 25px;
text-align: center;
font-size: 13px;
font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
}
#loading {
position: absolute;
top: 5px;
right: 5px;
font-size: 9px;
}
#calendar {
width: 100%;
margin: 0 auto;
}
</style>
</head>
<body>
<div id='loading' style='display:none'>Please Wait....Loading....</div>
<div id='calendar'></div>
</body>
</html>
I ran into the same problem, and here is how to get around it.
The problem arises because in Adam Shaw's most excellent FullCalendar plugin (v1), he is attaching event handlers to the calendar events lazily, on the event container mouseover. The problem is that Android does not implement the mouseover event properly, so the click handler doesn't get initialized.
One workaround is either to change the code in his plugin around line 1707 from: container.unbind('mouseover').mouseover(function(ev) {
to
container.unbind('click').click(function(ev) {
However, this will require you to click on an event to initialize any other events, so if you have hover events on the calendar event (which I guess you wouldn't since you're doing mobile dev), this method won't work.
The alternative, which I do, but defeats his lazy event initialization, is to add the following to your calendar initialization options:
eventAfterAllRender: function(){
// hack to trigger event binding on android chrome, which doesn't trigger mouseover events
$('.fc-event').each(function(i, element){
$(element).trigger('mouseover', {});
})
}
What this does is immediately trigger the mouseover event on all events in the calendar, thereby triggering the attachHandler on all calendar events.
这篇关于FullCalendar onClick事件打开的对话框中的Android不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
