JQUERY Alert Box OUI ou NON

JQUERY Alert Boîtes: un guide complet

Plusieurs méthodes existent pour gérer les événements d'alerte et de boîte de dialogue dans JQuery, y compris les plugins et les boîtes de dialogue intégrées. JQuery UI offre des options pour créer des boîtes de dialogue personnalisées, et cette page présente également divers exemples de fenêtres modales. Pour une solution rapide et simple, JavaScript simple peut être utilisé:

var answer = confirm('Are you sure you want to delete this?');
if (answer) {
  console.log('yes');
} else {
  console.log('cancel');
}

Questions fréquemment posées (FAQ)

Boîtes d'alerte jQuery personnalisées: La création de boîtes d'alerte personnalisées implique la fonction jQuery UI dialog(). Après avoir inclus la bibliothèque JQuery UI, créez un élément <div> pour servir de boîte d'alerte. Les options de la fonction dialog() permettent la personnalisation du contenu, des boutons et de l'apparence. Exemple:

$("#myAlert").dialog({
  autoOpen: false,
  modal: true,
  buttons: {
    "Ok": function() {
      $(this).dialog("close");
    }
  }
});

Boîtes de confirmation jQuery: Similaire aux boîtes d'alerte, les boîtes de confirmation utilisent dialog(), mais incluent les boutons "Confirmer" et "Annuler". Exemple:

$("#myConfirm").dialog({
  autoOpen: false,
  modal: true,
  buttons: {
    "Confirm": function() {
      // Perform action
      $(this).dialog("close");
    },
    "Cancel": function() {
      $(this).dialog("close");
    }
  }
});

Boîtes d'invite jQuery: Les cases d'invite incorporent un champ de saisie dans la boîte de dialogue. Exemple:

$("#myPrompt").dialog({
  autoOpen: false,
  modal: true,
  buttons: {
    "Submit": function() {
      var input = $("#myInput").val();
      // Use input value
      $(this).dialog("close");
    },
    "Cancel": function() {
      $(this).dialog("close");
    }
  }
});

Styling jQuery Alert Boîtes: Utilisez CSS pour styliser des boîtes d'alerte. JQuery UI propose des thèmes, et l'option dialogClass permet d'ajouter des classes CSS personnalisées.

Boîtes d'alerte dragable: La boîte de dialogue jQuery UI est glissable par défaut. Définissez l'option draggable sur false pour désactiver cela.

Boîtes d'alerte à la page Charge: Appelez la fonction dialog() sans autoOpen: false pour afficher une boîte d'alerte à la charge de la page.

Boîtes d'alerte non modales: Définissez l'option modal sur false pour créer une boîte d'alerte non modale.

CLOSE PROGRAMMATIQUE: Fermez une boîte de dialogue programmatiquement en utilisant $(this).dialog("close");.

Boîtes d'alerte avec délai d'expiration: Utilisez la fonction setTimeout() pour fermer automatiquement une boîte d'alerte après une heure spécifiée.

Animer des boîtes d'alerte: Utilisez les options show et hide dans dialog() pour spécifier les effets et les durées d'animation.

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!