Question

我的项目要求日历数据来自未通过Ajax加载的JSON变量，但是在HTML源代码中。

所以不要使用Ajax而不是使用Ajax：

$(".calendar-container").zabuto_calendar({
                    language: "en",
                    today: true,
                    nav_icon: { 
                        prev: '<i class="icon icon-arrow_left"></i>', 
                        next: '<i class="icon icon-arrow_right"></i>' 
                    },
                    ajax: { 
                        url: "json/calendar.json", 
                        modal: false
                    },

... });

我需要一个从此变量中获取事件数据的解决方案：

var jsondata = '[{"date": "2014-10-02","eventid": 20,"badge": true, "classname": "event"},    { "date": "2014-10-03", "eventid": 20, "badge": true, "classname": "event" }]';

位于HTML源代码的脚本标记内。

有没有明智的方法可以这样做？

Answer 1

在1.3版中，您现在可以使用数据选项：

<script type="application/javascript">
var eventData = [
   {
     "date": "2015-01-01",
     "badge": false,
     "title": "Example 1"
   },
   {
     "date": "2015-01-02",
     "badge": true,
     "title": "Example 2"
   }
];
$(document).ready(function () {
    $("#my-calendar").zabuto_calendar({ data: eventData });
});
</script>

Answer 2

旧帖子，但我已制作了自定义的Zabuto日历。

它没有经过测试，很多功能都没有了，但你应该看一眼：

  $("#my-calendar").zabuto_calendar({
    language: "fr",
    year: 2015,
    month: 1,
    show_previous: 1,
    show_next: 2,
    // show_reminder: true,
    // show_today: false,
    // show_days: true,
    // weekstartson: 0,
    // nav_icon: {
    //   prev: '<i class="fa fa-chevron-circle-left"></i>',
    //   next: '<i class="fa fa-chevron-circle-right"></i>'
    // },
    callbacks: {
      on_cell_double_clicked: function() {
        return cellDoubleClicked(this);
      },
      on_cell_clicked: function() {
        return cellClicked(this);
      },
      on_nav_clicked: function() {
        return navClicked(this);
      },
      on_event_clicked: function() {
        return eventClicked(this);
      }
    },
    events: {
      local: events_array,
      ajax: {
        url: "" // load ajax json events here...
      }
    },
    legend: [
      {label: "Rendez-vous", type: "appointment"},
      {label: "Evenement A", type: "eventtype2"},
      {label: "Evenement B", type: "eventtype3"},
      {label: "<span class='fa fa-bell-o'></span> Rappel", type: "reminder"}
    ]
  });

http://jsfiddle.net/n2gkm4d9/

（尝试在日包装器中双击，只需单击事件）

现在：

使用本地json + ajax数据的初始日历
调用公共方法（例如，一次只添加一个事件）
通过模式添加事件（不是zabuto日历中包含的模式，我已将其删除）
显示一天的事件列表
...

只需几个小时的工作，需要添加许多功能以及要使其稳定但可用的功能。 ; - ）

仔细查看代码......其实不仅仅是小提琴演出：

干杯

FRO

Zabuto日历：如何在没有Ajax的情况下通过JSON加载数据

2 个答案: