1

私の完全なコードはここにあります:http://pastebin.com/nctMtX9m

FullCalendarのインスタンスがあり、イベントオブジェクトの「className」プロパティを使用して、カレンダーのレンダリング後に特定のイベントにアイコンを追加しています。これらのシンプルなアイコンは、カレンダーのジョブ(イベント)が出荷されたかどうかを示します。

$(window).load(function(){
$('a.shipped div span').prepend("<img src=\"/img/truck_white.png\" title=\"Shipped\" alt=\"Shipped\" style=\"padding:2px 5px 5px 0; width=\"16\" height=\"16\" />");});

これはうまくいきます!問題は、月を変更してから戻ってくるなど、ビューを変更するたびに、FullCalendarがイベントを完全に再レンダリングすることです。これは、アイコンの追加プロセスが最初のレンダリング後に1回だけ発生するため、アイコンがないことを意味します。

FullCalendarがイベントをレンダリングするたびに起動するアイコン追加プロセスが必要です。

私はこれを見つけました:http://arshaw.com/fullcalendar/docs/event_data/events_function/しかし、残念ながら私の偶数はPHPによってページに書き込まれるため、スクリプトに関する限り静的に定義されます。この例では、これは外部データソースでのみ実行できると私は信じています。このレベルのJavaScriptは、確かに私の得意ではありません。

イベントデータが静的に定義されている場合、Fullcalendarがイベントをレンダリングするたびに起動するものにアイコン追加プロセスをアタッチするにはどうすればよいですか?

ありがとう!

編集eventRenderを使用してやりたいことを行う方法を見つけましたが、レンダリングが少しずれているため、要素の必要な部分を参照できないようです。これについてさらに取り組み、答えが見つかったら更新します。

編集2それを理解しました、私は新しいので答えを投稿することはできません。明日回答を投稿します。

4

1 に答える 1

1

解決策は、eventRender を使用することでした。

eventRender: function(event, element) {
if(event.className == 'shipped'){
    var find = '<span class="fc-event-title">';
    var replace = find + '<img src="/img/truck_white.png" title="Shipped" alt="Shipped" class="event_icon" />';
    var newHTML = $(element).html().replace(find, replace);
    $(element).html(newHTML);
}
}

少し複雑な検索/置換ですが、機能します。

于 2013-03-21T14:16:53.787 に答える