Maison > interface Web > js tutoriel > Comment désactiver les week-ends et les jours fériés dans jQuery UI Datepicker ?

Comment désactiver les week-ends et les jours fériés dans jQuery UI Datepicker ?

Patricia Arquette
Libérer: 2024-11-18 07:20:02
original
604 Les gens l'ont consulté

How to Disable Weekends and Holidays in jQuery UI Datepicker?

Désactivation des samedis, dimanches et jours fériés dans jQuery UI Datepicker

Le jQuery UI Datepicker offre des options de personnalisation étendues pour répondre à des exigences spécifiques. Un besoin courant est de désactiver certains jours de la semaine ou des dates spécifiques dans la plage de sélection.

Désactivation des week-ends

Pour empêcher les utilisateurs de sélectionner les jours du week-end (samedi et dimanche ), vous pouvez tirer parti de la fonction intégrée $.datepicker.noWeekends :

$(".selector").datepicker({
  beforeShowDay: $.datepicker.noWeekends
});
Copier après la connexion

Désactiver les jours fériés

Pour exclure des jours fériés spécifiques de la sélection, vous pouvez créer une fonction personnalisée comme :

function nationalDays(date) {
  // Replace [YOUR_HOLIDAY_DATES] with the specific dates you want to disable.
  if ([YOUR_HOLIDAY_DATES].includes(date.toString())) {
    return [false, 'holiday-day'];
  }
  return [true, ''];
}
Copier après la connexion

Combiner la désactivation du week-end et des jours fériés

Pour désactiver les week-ends et les jours fériés, vous pouvez combiner les deux fonctions :

function noWeekendsOrHolidays(date) {
  var noWeekend = $.datepicker.noWeekends(date);
  if (noWeekend[0]) {
    return nationalDays(date);
  } else {
    return noWeekend;
  }
}
Copier après la connexion

Ensuite, appliquez la fonction combinée au Datepicker :

$(".selector").datepicker({
  beforeShowDay: noWeekendsOrHolidays
});
Copier après la connexion

Remarque : Dans jQuery UI 1.8.19 et versions ultérieures, l'option beforeShowDay prend en charge un troisième paramètre facultatif pour afficher un info-bulle sur les dates désactivées.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

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
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal