Javascript Zabuto 日历中的 onclick 事件

Question

我有一个 Zubuto 日历运行很好：（示例： http://www.claytonce.co.uk/index-new.asp )

事件数据来自从数据库生成的 '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>

我在数据中有一个 'url' 引用，但我想在日期创建一个 onclick 事件以转到 url（不是模态）- 这容易实现吗？

我尝试按照 Zabuto GitHub 页面上的示例以及 Whosebug 此处引用的其他 onclick 事件进行操作，但它们似乎指的是模态 windows。我似乎在努力调用我的 'eventdata' 变量中的 'url' 引用。

我希望有人能提供帮助 - 我对 Javascript 不是很好！

感谢您的宝贵时间！

Answer 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) ; 

}
    });

  });

它将根据您的要求工作。

Javascript Zabuto 日历中的 onclick 事件

Javascript onlick event in Zabuto Calendar

javascript

jquery

calendar