2015-12-09 45 views
0

的Javascript点击数事件我有一个Zubuto日历运行很好这里:(例如: http://www.claytonce.co.uk/index-new.asp在Zabuto日历

事件数据是从被从数据库中生成的“EVENTDATA”变量来。生成的脚本是在这里:

<script type="application/javascript"> 

var eventData = [ 
{"date":"2015-12-09", "badge":false,"title":"School Christmas Lunch", "url":"http://www.claytonce.co.uk/event-detail.asp?id=4"}} 
] 
    $(document).ready(function() { 
    $("#my-calendar").zabuto_calendar({ 
     today: true, 
     data: eventData, 
     weekstartson: 0, 
     nav_icon: { 
     prev: '<i class="fa fa-chevron-left"></i>', 
     next: '<i class="fa fa-chevron-right"></i>' 
     } 
    }); 

    }); 
</script> 

我已经在数据中的“网址”参考,但我想上的日期创建一个onclick事件到那个网址(并非模态) - 这是很容易实施?

我尝试过以下Zabuto GitHub页面上的示例,以及StackOverflow中引用的其他onclick事件,但它们似乎指的是模式窗口。我似乎在努力在'eventdata'变量中调用'url'引用。

我希望有人可以帮忙 - 我用Javascript不是很好!

感谢您的时间!

回答

1

添加此功能的脚本:

function redirectTODateUrl (id) { 
    var date = $("#" + id).data("date"); 
    for (var i = 0; i < eventData.length; i++) { 
     if(eventData[i]["date"] == date){ 
      url = eventData[i]["url"] 
      if(typeof(url) != "undefined"){ 
      location = url; 
      } 
     } 
    } 
} 

和修改代码日历: -

$("#my-calendar").zabuto_calendar({ 
     today: true, 
     data: eventData, 
     weekstartson: 0, 
     nav_icon: { 
     prev: '<i class="fa fa-chevron-left"></i>', 
     next: '<i class="fa fa-chevron-right"></i>' 
     }, 
    action: function() { 

    id = this.id; 
    redirectTODateUrl (id) ; 

} 
    }); 

    }); 

它将工作按您的要求。

+0

绝对精湛!完美的作品 - 就是我想要的。非常感谢! – sadrobot