將onClick事件添加到zabuto日歷

Question

我已經在項目中實現了zabuto日歷。 這是屏幕截圖：
。
我希望單擊時更改日期單元格的顏色。 這是我的代碼的一部分：

$(document).ready(function () {
                $("#my-calendar").zabuto_calendar({
                    cell_border: true,
                    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>'
                    }
                });
            });

這是onClick代碼。

myDateFunction(this.id);
function myDateFunction(id) {
  var date = $("#" + id).data("date");
  document.getElementById("#" + id).style.color = "blue";
}
 $("#my-calendar").zabuto_calendar({
            action: function () {
                return myDateFunction(this.id, false);
            },
legend: [
                {type: "text", label: "Special event", badge: "00"},
                {type: "block", label: "Regular event"}
            ]
        });

但這是行不通的。 我該如何解決？

Answer 1

舊帖子，但我制作了自定義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

Answer 2

瀏覽此http://zabuto.com/dev/calendar/examples/action.html 。 它包含您的答案。