Maison > interface Web > js tutoriel > Nouvel algorithme pour le contrôle de calendrier de style blog JavaScript

Nouvel algorithme pour le contrôle de calendrier de style blog JavaScript

高洛峰
Libérer: 2017-01-04 13:58:26
original
1173 Les gens l'ont consulté

Instructions d'utilisation :

Le programme est relativement simple et il y a des instructions dans le code Voici comment l'utiliser.
La première étape consiste à instancier un calendrier et à définir les paramètres.
Description du paramètre :
Année : l'année à afficher
Mois : le mois à afficher
SelectDay : sélectionner la date
onSelectDay : déclencher à la date sélectionnée
onToday : déclencher à la date d'aujourd'hui
onFinish : Déclenché après le tracé du calendrier

Généralement, SelectDay est défini sur la date sélectionnée, et une fonction est définie dans onSelectDay pour définir le style de cette date
Par exemple. , dans l'exemple, SelectDay est défini sur aujourd'hui Le 10 du mois et le style est défini sur onSelect ce jour-là :

SelectDay: new Date().setDate(10), 
onSelectDay: function(o){ o.className = "onSelect"; },
Copier après la connexion

Et onToday est utilisé pour définir le style de la date d'aujourd'hui,
Par exemple, dans l'exemple, le style de la date d'aujourd'hui est défini sur onToday :

onToday: function(o){ o.className = "onToday" },
Dans onFinish, vous pouvez mettre le programme cela doit définir le calendrier.
Vous pouvez obtenir l'année et le mois affichés par le calendrier actuel via this.Year et this.Month.
Les dates avec des données sont également définies ici. Par exemple, dans l'exemple, il y a une liste de dates avec des données dans le mois en cours, puis les dates correspondantes sont définies en fonction de cette liste :

var flag = [10,15,20]; 
for(var i = 0, len = flag.length; i < len; i++){ 
this.Days[flag[i]].innerHTML = "<a href=&#39;javascript:void(0);&#39; onclick=\"alert(&#39;日期是:"+this.Year+"/"+this.Month+"/"+flag[i]+"&#39;);return false;\">" + flag[i] + "</a>"; 
}
Copier après la connexion

Exemple Cette liste de dates est fixe. Dans les applications réelles, la liste de dates correspondante peut être obtenue en fonction de l'année et du mois
Je recommande personnellement d'utiliser l'année et le mois pour l'obtenir via ajax.

Il existe également deux méthodes utiles dans le programme : PreMonth (affiche le mois précédent) et NextMonth (affiche le mois suivant).

Code de test :

 
 
 
 
blog式日历控件_www.jb51.net_脚本之家 
 
 
 
 
<<
>>
20088
Copier après la connexion

Pour plus d'articles liés au nouvel algorithme de contrôle de calendrier de style blog JavaScript, veuillez faire attention au site Web PHP chinois !


Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal