wake-up-neo.com

Hover- und Click-Funktionen kombinieren (jQuery)?

Können Hover- und Click-Funktionen zu einer zusammengefasst werden, zum Beispiel:

klicken:

$('#target').click(function() {
  // common operation
});

schweben:

$('#target').hover(function () {
    // common operation
});

können sie zu einer funktion zusammengefasst werden?

Vielen Dank!

javascriptjqueryfunctionclickhover
38
3zzy

Verwenden Sie die grundlegende Programmierzusammensetzung: Erstellen Sie eine Methode und übergeben Sie die gleiche Funktion als Rückruf an click und hover.

var hoverOrClick = function () {
    // do something common
}
$('#target').click(hoverOrClick).hover(hoverOrClick);

Zweiter Weg: Verwenden bindon:

$('#target').on('click mouseover', function () {
    // Do something for both
});

jQuery('#target').bind('click mouseover', function () {
    // Do something for both
});
91
Emil Ivanov

Verwenden Sie stattdessen mouseover.

$('#target').on('click mouseover', function () {
    // Do something for both
});
28
Vergilius

Sie können .bind() oder .live() verwenden, je nachdem, was angemessen ist, aber Sie müssen die Funktion nicht benennen:

$('#target').bind('click hover', function () {
 // common operation
});

oder wenn Sie dies für viele Elemente getan haben (nicht viel Sinn für ein IE, es sei denn, das Element ändert sich):

$('#target').live('click hover', function () {
 // common operation
});

Beachten Sie, dass dies nur das erste Hover-Argument bindet, das mouseover -Ereignis, und nichts mit dem mouseleave -Ereignis verknüpft.

9
Nick Craver
$("#target").hover(function(){
  $(this).click();
}).click(function(){
  //common function
});
7
D_N
var hoverAndClick = function() {
    // Your actions here
} ;

$("#target").hover( hoverAndClick ).click( hoverAndClick ) ;
1
St.Woland

Sie können auch bind verwenden:

$('#myelement').bind('click hover', function yourCommonHandler (e) {
   // Your handler here
});
1
PatrikAkerstrand

ich denke, der beste Ansatz ist es, eine gemeinsame Methode zu erstellen und hover und click Ereignisse aufzurufen .

0
Adeel
  $("#target").on({
        hover: function(){
           //do on mouse hover
        },  
        click: function(){
            //do on mouse click
        }  
    });
0
Suhani Mendapara