Código web para efecto calendario

Objeto.extend = función(destino, fuente) {

for (propiedad var en fuente) {

destino[propiedad] = fuente[propiedad ];

}

destino de retorno;

}

var Calendario = Class.create(); > Calendar.prototype = {

inicializar: función(contenedor, opciones) {

this.Container = $(contenedor); //estructura de tabla contenedor

this.Days = [ ]; // Lista de fechas

this.SetOptions(options

this.Year = this.options.Year

this; .Mes = este.opciones.Mes;

este.SelectDay = este.opciones.SelectDay ?Draw();

},

EstablecerOpciones: función( opciones) {

this.options = {/Defaults

Año: nueva fecha().getFullYear(),

Mes: nueva fecha().

SelectDay: null, //Seleccionar fecha

onSelectDay: function(){},

onToday: function(){},

onFinish: function(){}.

};

Object.extend(this.options, options || {}); /p>

//PreMes

PreMes: function() {

// Obtener el objeto de fecha del último mes

var d = nueva fecha (esta .Año, this.Draw();

},

///PróximoMes

PróximoMes: función() {

var d = new Date(this.p>

},

Draw: function() {

//Guardar la lista de fechas

var arr = []

;

//Utiliza el valor del primer día del mes en una semana como el número de días del mes desde el primer día

for(var i = 1, firstDay = nueva fecha (este.año, este.mes - 1, 1).getDay(); i lt; = primerdía; { ​​arr.push(" "); El valor de fecha del último día se utiliza como el número de días del mes

for(var i = 1, MonthDay = new Date(this.Year, this.Month, 0).getDate( ); i lt; = MonthDay ; i ){ arr.push(i }

// Utilice el valor de fecha del último día del mes como número de días del mes. >

for(var i = 1, mesDía = nueva Fecha(este.Año, este.Mes, 0).getDate(); i lt; = mesDía; i ){ arr.push(i); p>

// //

var frag = document.createElement("td");

cell.innerHTML = " "; ( arr.length gt; 0){

var d = arr.shift();

cell.innerHTML = d

if(d gt; 0){

this.Days [d] = cell

//Obtener hoy

if (this.IsSame(new Date(this.Year, this.Month - 1, d), new Date() )){ this.onToday(cell }

//Para determinar si el usuario ha realizado una selección

if; (this.SelectDay amp; amp; this. amp; this .IsSame(new Date(this.Year, this.Month - 1, d), this.SelectDay)){ this.onSelectDay(cell);

}

// Para determinar si el usuario ha realizado una selección

if(this.SelectDay amp; amp; this.

}

}

fila.appendChild( celda);

}

frag.appendChild( fila)

}

}

// Este contenido se borra primero y luego se inserta (es decir, la tabla no puede usar InnerHTML)

while(this.Container. hasChildNodes() ){ este.Contenedor.removeChild(este.Contenedor.fi

rstChild); }

this.Container.

this.Container.appendChild(frag);

this.onFinish(); >},

// Determinar si es el mismo día

IsSame: function(d1, d2) {

return (d1.getFullYear() = = d2 .getFullYear() amplificador; d1.getMonth() == d2.getMonth() amplificador; d1.getDate() == d2.getDate());

}

};

lt;/scriptgt;

lt;/headgt;

.lt;bodygt; /p>

lt;div class="Calendario"gt;

lt;div id="idCalendarPre"gt; id=" idCalendarNext" > lt;/spangt;mes

lt;table cellspaces="0"gt;

lt;theadgt

lt;trgt;

lt;tdgt;daylt;/tdgt;

lt;tdgt;Ilt;

lt;tdgt;IIlt;/tdgt;

lt;tdgt ;IIIlt;/tdgt;

lt;tdgt;IVlt;/tdgt;

lt;tdgt;Vlt;/tdgt; p>lt;tdgt; VIlt;/tdgt;

lt;/trgt;

lt;/theadgt;

lt; gt;

lt;/tbodygt;

lt;/tablegt;

lt;/divgt; "JavaScript"gt;

var cale = new Calendar("idCalendar", {

SelectDay: new Date().setDate(10),

onSelectDay : función(o){ o.className = "onSelect" },

onToday: función(o){ o.className = "onToday" },

onFinish: función (){

$("idCalendarYear").innerHTML = este.Año; $("idCalendarMonth").innerHTML = este

onFinish: functio;

n(){

$("idCalendarYear").innerHTML = este.Año; $("idCalendarMonth").innerHTML = este.Mes