Объединить функции наведения и нажатия (jQuery)? - PullRequest
38 голосов
/ 12 марта 2010

Можно ли комбинировать функции наведения и щелчка, например:

нажмите:

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

парения:

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

можно ли их объединить в одну функцию?

Спасибо!

Ответы [ 8 ]

90 голосов
/ 12 марта 2010

Использовать базовую композицию программирования: создать метод и передать ту же функцию в click и hover в качестве обратного вызова.

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

Второй способ: использовать bindon:

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

jQuery('#target').bind('click mouseover', function () {
    // Do something for both
});
28 голосов
/ 09 декабря 2013

Используйте при наведении курсора вместо наведения.

$('#target').on('click mouseover', function () {
    // Do something for both
});
9 голосов
/ 12 марта 2010

Вы можете использовать .bind() или .live(), в зависимости от того, что подходит, но не нужно называть функцию:

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

или если вы делали это на большом количестве элементов (для IE нет особого смысла, если элемент не изменяется):

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

Обратите внимание, что это будет связывать только первый аргумент наведения, событие mouseover, оно не будет ничего привязывать к событию mouseleave.

6 голосов
/ 12 марта 2010
$("#target").hover(function(){
  $(this).click();
}).click(function(){
  //common function
});
1 голос
/ 12 марта 2010

Вы также можете использовать bind :

$('#myelement').bind('click hover', function yourCommonHandler (e) {
   // Your handler here
});
1 голос
/ 12 марта 2010
var hoverAndClick = function() {
    // Your actions here
} ;

$("#target").hover( hoverAndClick ).click( hoverAndClick ) ;
0 голосов
/ 23 февраля 2017
  $("#target").on({
        hover: function(){
           //do on mouse hover
        },  
        click: function(){
            //do on mouse click
        }  
    });
0 голосов
/ 12 марта 2010

я думаю, что лучший подход - сделать общий метод и вызвать hover и click events .

...