jQuery的上組合

我使用這些功能，這很好地工作：jQuery的上組合

$(document).on('click', '.profile li', function(e) { 
      //Alot of cool code 
    }); 
    $(document).on('mouseenter', '.profile li', function(e) { 
      //Alot of cool code 
    }); 
    $(document).on('mouseleave', '.profile li', function(e) { 
      //Alot of cool code 
    }); 
    $(document).on('keydown', '.profile li', function(e) { 
      //Alot of cool code 
    });

，但我想將它們組合成這樣：

$('.profile li').on({ 
     mouseenter: function (e) { 
      //Alot of cool code 
     }, 
     mouseleave: function (e) { 
      //Alot of cool code 
     }, 
     click: function (e) { 
      //Alot of cool code 
     }, 
     keydown: function (e) { 
      //Alot of cool code 
     } 
    });

然而，因爲它們依賴於獲得後創建的元素聯合代碼不起作用。所以我的問題是，是否有辦法將它們組合成第二種方式，並且仍然可以使用在dom之後創建的類。還有什麼要結合他們嗎？我似乎記得閱讀一些在哪裏，它更好，但我不記得爲什麼，如果那是一個夢想......

來源

2012-12-14 cKendrick

我問過一些天前同等的問題：http://stackoverflow.com/questions/13604582/multiple-jquery-events -on-one-element-with-different-functions-and-target-select看看這個：https://gist.github.com/4191657 – yckart

只要傳遞選擇器作爲第二個參數，請注意使用最接近的靜態父級比使用文檔對象更有效。

$(document).on({ 
    mouseenter: function (e) { 
     //Alot of cool code 
    }, 
    mouseleave: function (e) { 
     //Alot of cool code 
    }, 
    click: function (e) { 
     //Alot of cool code 
    }, 
    keydown: function (e) { 
     //Alot of cool code 
    } 
}, '.profile li');

來源

2012-12-14 22:32:27 undefined

非常感謝。這樣做有沒有什麼好處，還是做所有單獨的功能呢？ – cKendrick

@cKendrick不客氣，這會讓你的代碼更乾淨，但兩者之間沒有主要區別。 – undefined

我已經問了幾天前相當的questions。

我的回答很簡單，使用我的解決方法功能gist。

所以，你可以簡單地使用這樣的：

$(document).act(
    ['mouseenter', 'selector1', function() {}], 
    ['mouseleave', 'selector2', function() {}], 
    ['mousedown', 'selector3', function() {}], 
    ['mouseup', 'selector4', function() {}] 
);

或者甚至是簡單的，沒有我的腳本：

$(document).on({ 
    mouseenter: function() {}, 
    mouseleave: function() {}, 
    mousedown: function() {}, 
    mouseup: function() {} 
}, "selector");

然而，這種假設您想要使用的相同的選擇對所有的那些事件。

來源

2012-12-14 22:31:49 yckart

如果.profile爲靜態元素，試試這個：

$('.profile').on({ 
     mouseenter: function (e) { 
      //Alot of cool code 
     }, 
     mouseleave: function (e) { 
      //Alot of cool code 
     }, 
     click: function (e) { 
      //Alot of cool code 
     }, 
     keydown: function (e) { 
      //Alot of cool code 
     } 
    },'li');

來源

2012-12-14 22:32:41

jQuery的上組合

回答

相關問題