Eigene Events mit jQuery Bind und Trigger

Mit jQuery ist es möglich, eigene JavaScript-Events zu definieren und auszulösen (trigger). Alle Elemente, die an dieses Ereignis gebunden (bind) sind, werden dann benachrichtigt und können eine eigene Ereignisbehandlung vornehmen:

Beispiel:

<!DOCTYPE html>
<html>
  <head>
    <title>Bind and trigger events</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <style>
      *{margin:0;padding:0;border:0;}
      html,body{width:100%;height:100%}
 
      .box{
        width: 50%;
        height: 100%;        
      }
 
      #leftBox{
        background-color: burlywood;
        float: left;
      }
 
      #rightBox{
        background-color: cadetblue;
        float: right;
      }
    </style>
  </head>
  <body>
    <div class="box" id="leftBox"></div>
    <div class="box" id="rightBox"></div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <script>
      $(document).ready(function(){
        $('#leftBox').bind('myEvent', 
        function(event, argument){
          this.innerHTML = 'Argument "'+argument+'" received at: '+event.timeStamp;
        });
 
        $('#rightBox').bind('myEvent', 
        function(event, argument){
          this.innerHTML = 'Argument "'+argument+'" received at: '+event.timeStamp;
        });
 
        $('#leftBox,#rightBox').trigger('myEvent', 'Hello World');
      });
    </script>
  </body>
</html>

Im Ergebnis sieht es dann so aus, dass beide Boxen auf das ausgelöste Event (myEvent) reagieren und einen Text anzeigen, der diesem ähnelt:

Linke Box: Argument „Hello World“ received at: 1342172027828
Rechte Box: Argument „Hello World“ received at: 1342172027830

In der Fachsprache die Verwendung dieses Programmierschemas als „Event Pooling“ bezeichnet. Siehe Event Pooling with jQuery Using Bind and Trigger: Managing Complex Javascript.

Eigene Events mit jQuery Bind und Trigger

Ein Gedanke zu „Eigene Events mit jQuery Bind und Trigger“

Schreibe einen Kommentar Antworten abbrechen