JQuery .on () -Methode mit mehreren Ereignishandlern für einen Selektor

Es wird versucht herauszufinden, wie die Methode Jquery .on () mit einem bestimmten Selektor verwendet wird, dem mehrere Ereignisse zugeordnet sind. Ich habe zuvor die .live () -Methode verwendet, bin mir aber nicht ganz sicher, wie ich mit .on () das gleiche Kunststück vollbringen soll. Bitte beachten Sie meinen Code unten:

$("table.planning_grid td").live({
  mouseenter:function(){
     $(this).parent("tr").find("a.delete").show();
  },
  mouseleave:function(){
     $(this).parent("tr").find("a.delete").hide();        
  },
  click:function(){
    //do something else.
  }
});

Ich weiß, dass ich die verschiedenen Ereignisse zuweisen kann, indem ich anrufe:

 $("table.planning_grid td").on({
    mouseenter:function(){  //see above
    },
    mouseleave:function(){ //see above
    }
    click:function(){ //etc
    }
  });

Aber ich glaube, die richtige Verwendung von .on () wäre wie folgt:

   $("table.planning_grid").on('mouseenter','td',function(){});

Gibt es eine Möglichkeit, dies zu erreichen? Oder was ist hier die beste Vorgehensweise? Ich habe den folgenden Code ausprobiert, aber keine Würfel.

$("table.planning_grid").on('td',{
   mouseenter: function(){ /* event1 */ }, 
   mouseleave: function(){ /* event2 */ },
   click: function(){  /* event3 */ }
 });

Danke im Voraus!

Das ist umgekehrt . Sie sollten schreiben:

$("table.planning_grid").on({
    mouseenter: function() {
        // Handle mouseenter...
    },
    mouseleave: function() {
        // Handle mouseleave...
    },
    click: function() {
        // Handle click...
    }
}, "td");

Wenn Sie mehrere Ereignishandler an denselben Selektor angehängt haben, der dieselbe Funktion ausführt, können Sie diese auch verwenden

$('table.planning_grid').on('mouseenter mouseleave', function() {
    //JS Code
});

Wenn Sie dieselbe Funktion für verschiedene Ereignisse verwenden möchten, kann der folgende Codeblock verwendet werden

$('input').on('keyup blur focus', function () {
   //function block
})

Ich habe von hier etwas wirklich Nützliches und Grundlegendes gelernt .

Verkettungs Funktionen ist sehr nützlich in diesem Fall die auf den meisten jQuery - Funktionen einschließlich arbeitet auf zu Funktionsausgang.

Dies funktioniert, da die Ausgabe der meisten jQuery-Funktionen die Eingabeobjektsätze sind, sodass Sie sie sofort verwenden und kürzer und intelligenter gestalten können

function showPhotos() {
    $(this).find("span").slideToggle();
}

$(".photos")
    .on("mouseenter", "li", showPhotos)
    .on("mouseleave", "li", showPhotos);

Und Sie können dieselben Ereignisse / Funktionen auf folgende Weise kombinieren:

$("table.planning_grid").on({
    mouseenter: function() {
        // Handle mouseenter...
    },
    mouseleave: function() {
        // Handle mouseleave...
    },
    'click blur paste' : function() {
        // Handle click...
    }
}, "input");

Versuchen Sie es mit folgendem Code:

$("textarea[id^='options_'],input[id^='options_']").on('keyup onmouseout keydown keypress blur change', 
  function() {

  }
);