Une brève discussion sur la liaison personnalisée de jQuery

jqueryLiaison personnalisée

Voyons d'abord comment utiliser la liaison personnalisée de jQuery. Vous pouvez utiliser bind ou live pour vous abonner à un événement (Of. bien sûr, on peut également être utilisé après la 1.7), le code est le suivant :

$("#myElement").bind('customEventName',function(e){ ... });
$(".elementsClass").live('customEventName',function(e){ ... });

Déclenchez ensuite l'événement dans le de la manière suivante :

$("#myelement").trigger('customEventName');

Ou vous pouvez ajouter des paramètres supplémentaires à l'événement personnalisé, par exemple :

$("#myelement").bind('customEventName',function(e,data){ if(data.custom) ... });
$("#myelement").trigger('customEventName',{ custom: false });

Mise à niveau magique

La mise à niveau dite magique signifie en fait que tous les événements personnalisés de l'ensemble du programme peuvent être automatiquement enregistrés et lié Définissez-le sur jQuery, puis lorsqu'il sera exécuté, tous les modules qui ont enregistré l'événement seront exécutés. Par exemple, la méthode UserUpdate définie dans le module User.js et la méthode BlogUpdate définie dans Blogs.js définissent toutes deux la fonctionfonction qui doit être exécutée lors de la publication d'un blog. Nous pouvons nous lier à un conteneur spécifié par jQuery (tel que document) en enregistrant un nom d'événement unifié (tel que BlogAdded), puis après avoir publié avec succès le blog, exécutez $(document).trigger("BlodAdded ") C'est OK.

Ci-dessous, nous donnons un exemple de code général :

    var components = [User, Blog, Group, Friend, Topic, Photo];
var eventTypes = ["AddComplete", "UpdateComplete", "DeleteComplete", "LockComplete", "UnLockComplete"];
      $.each(components, function(i,component) {
        $.each(eventTypes, function(i,eventType) {
var handler = component[eventType];
if (handler) $(document).bind(eventType, handler);
        });
      })

Ensuite, chaque module js définit le code installe au format suivant :

    User= {
      AddComplete: function(e, data) {
//...
      },
      UpdateComplete: function(e, data) {
//...
      }
    }

De cette façon, peu importe où vous l'êtes, si nous en avons besoin, nous pouvons utiliser jQuery pour déclencher nos événements :

$(document).trigger("UpdateComplete", data);

Par cette méthode, vous pouvez trouver que la méthode d'un module ne peut enregistrer qu'un seul événement. Si nous utilisons une méthode pour enregistrer plusieurs déclencheurs d'événements, nous pouvons utiliser la méthode suivante :

    var blogController = {
      blogAddOrUpdateComplete: function() {
//...
      }
    }
    blogController.blogAddComplete = blogController.blogUpdateComplete = blogController.blogAddOrUpdateComplete;

Remarque finale : cet article montre simplement un exemple simple. Ne mélangez pas l'utilisation du même nom d'événement dans différents modules. Par exemple, AddComplete et AddComplete dans User. js AddComplete dans Blog.js peut ne pas être lié du tout, c'est-à-dire qu'il ne traite que sa propre logique correspondante. À ce stade, cet événement ne doit pas être traité de manière uniforme, mais si les éléments à détecter sont les mêmes, vous pouvez le faire. peut l'utiliser, comme DisableUserComplete, il peut être utilisé universellement, car le module Utilisateur doit gérer les opérations après la désactivation du compte, et le module Blog peut également avoir besoin de gérer les opérations après la désactivation du compte.

Conclusion

Notes de l'oncle : Destinées à enregistrer divers conseils et informations (y compris, mais sans s'y limiter, la technologie) dans le travail quotidien, s'ils vous sont utiles , s'il vous plaît, recommandez-en un pour donner à votre oncle la motivation d'écrire

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!