2016-11-03 1 views
0

Ich baue einen Kalender, der verschiedene Ereignisse für einen bestimmten Monat zeigt. Ich benutze jQuery fullcalendar.jQuery fullcalendar: Wie kann ich die Hintergrundfarbe der Tage, die nicht zum aktuellen Monat gehören, gezielt einstellen und ändern?

Ich habe eine bestimmte Farbe für jeden Tag des Monats.

Dafür verwende ich den folgenden Code:

dayRender: function (date, cell) { 
    var cellDate = date.format('D'); 
    cell.css('background-color', json_backgrundColor[cellDate]);  
}, 

json_backgrundColor[cellDate] ein Array ist, die für jeden Tag, um die spezifische Farbe enthält. cellDate ist eine ganze Zahl (1 Ende des spezifischen Monats (28/29/30/31)).

Mein Problem ist, dass die Tage des vorherigen Monats und des nächsten Monats auch davon betroffen sind. Sie werden entsprechend den Werten des jeweiligen Monats gefärbt.

zB: - Tag 29 des Vormonats wird immer die Hintergrundfarbe des Tages 29 der aktuelle Monat - 1. Tag des nächsten Monats wird die Hintergrundfarbe des Tages bekommt 1 des aktuellen Monats

Siehe Bild:

[Example month

ich die Hintergrundfarbe von Tagen will vom vorherigen/nächsten Monat wird weiß sein. (siehe die markierten Tage im Bild angehängt. Sie gehören nicht zu dem bestimmten Monat und ich will, dass sie mit weißer Hintergrundfarbe sind)

Jeder weiß, wie kann ich sie zielen und es tun?

+0

Überprüfen Sie, welche Klassen diese Zellen haben, und ob es einen Unterschied zwischen Zellen für Tage in der aktuellen vs anderen Monaten gibt. – CBroe

+0

Ich denke, ich sollte in Javascript schreiben 2 "wenn" s. DayRender: Funktion (Datum, Zelle) { var cellDate = Datum.format ('D'); if (Datum lastDayOfCurrentMonth) { cell.css ('Hintergrundfarbe', weiß); } sonst { cell.css ('Hintergrundfarbe', json_backgrundColor [cellDate]); } }, das Problem ist, dass ich nicht weiß, wie man es in Javascript schreibt. Kann jemand helfen? – codingnighter2000

+0

Nein. Wenn, das überprüft die Zellen-Klasse. – CBroe

Antwort

0

Versuchen Sie dies: .fc-anderen-Monat { Hintergrundfarbe: rot; } `

+0

Überprüfen Sie dies: https://jsfiddle.net/Venkatachalam_Perisetla/hzq47kbg/ – Venkatachalam

+0

danke für die Antwort. aber das funktioniert nicht für mich.Die "dayRender: function" im javascript-Teil überschreibt sie. – codingnighter2000

+0

$ ('td.fc-other-month'). Prop ('disable', true); $ ('td.fc-other-month'). AddClass ('fc-state-disabled'); – Venkatachalam

0

Versuchen Sie folgendes:

.fc-other-month{ 

background-color: red; }

Klicken Sie hier [https://jsfiddle.net/Venkatachalam_Perisetla/hzq47kbg/][1]

+0

Sie sollten mit dem "Try this" -Ding aufhören. Stellen Sie sicher, dass Sie die Frage verstehen (kommentieren Sie, wenn Sie dies nicht tun, um nach Klarstellungen zu fragen), stellen Sie sicher, dass Sie zu einer Lösung kommen, die funktioniert, und veröffentlichen Sie dann diese Lösung. Nur zu erraten, was die Lösung sein könnte, ist nicht genug Antwort. Wenn Sie schon dabei sind, sollten Sie Ihre Antworten richtig formatieren und eine aussagekräftige Beschreibung hinzufügen, warum Ihre Antwort das Problem des OPs löst. Und posten Sie nicht mehr als eine Antwort mit derselben Lösung. Werfen Sie einen Blick auf [Wie schreibe ich eine gute Antwort?] (Http://stackoverflow.com/help/how-to-answer). Vielen Dank! –

1

Die Zellen, die außerhalb des aktuellen Monats fallen erhalten die Klasse fc-other-month - so alles, was Sie tun müssen, sollte die Klasse prüfen sein, und nur auf der Zelle funktionieren, wenn es doesn Ich habe es:

+0

danke !! das funktioniert für mich! Danke für die Hilfe! – codingnighter2000

Verwandte Themen