结合悬停和单击功能（jQuery）？

Question

可以将悬停和点击功能合二为一，例如：

点击：

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

悬停：

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

它们可以组合成一个功能吗？

谢谢！

Answer 1

$("#target").hover(function(){
  $(this).click();
}).click(function(){
  //common function
});

Answer 2

我认为最好的方法是制作一个common方法并调用hover和click 事件。

Answer 3

使用基本的编程组合：创建一个方法并将相同的函数作为回调传递给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
});

Answer 4

var hoverAndClick = function() {
    // Your actions here
} ;

$("#target").hover( hoverAndClick ).click( hoverAndClick ) ;

Answer 5

你也可以使用bind:

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

Answer 6

您可以使用.bind() 或.live() 哪个合适，但无需命名函数：

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

或者如果你在很多元素上这样做（对于 IE 来说没有多大意义，除非元素发生变化）：

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

注意，这只会绑定 first 悬停参数mouseover 事件，它不会将任何东西与mouseleave 事件挂钩。

Answer 7

使用 mouseover 代替悬停。

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

Answer 8

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