jQuery + CSS：如何檢測遊標的第一個「移出」元素？

我試圖做的和Twitter一樣 - 當你點擊Follow按鈕時，然後在那裏添加了名爲cancel-hover-style的類。當您將光標移出此按鈕時，將刪除CSS類cancel-hover-style。jQuery + CSS：如何檢測遊標的第一個「移出」元素？

如何檢測「第一次搬出」？

你

來源

2014-07-09 user984621

使用''mouseleave''或''mouseout''事件 –

聽起來像是你應該看看jQuery的文檔的事件部分 – samrap

的http：// API .jquery.com/category/events/mouse-events/ –

使用jQuery謝謝，這可能是所有你需要做到這一點的事件，修改，當然您的特定邏輯要求。

elem.on("mouseover", function() { $(this).addClass("hoverClass"); }); 
elem.on("mouseout", function() { $(this).removeClass("hoverClass"); }) 
elem.on("mousedown", function() { $(this).addClass("clickClass"); }); 
elem.on("mouseup", function() { $(this).removeClass("clickClass"); })

刪除的事件處理程序的特定事件，在處理程序中添加

$(this).off("eventName");

和控制過程的特定部分，使每個peice的不同的處理函數，然後你可以使用

$(this).off("eventName"[, selector, handler]);

其中選擇器和處理程序都是可選參數。

UPDATE

在這裏通過另一個答案提供的信息光，我同意在實例可用於該特定情況下，通過使用。一被簡化（）代替。對（）。實際上，完美契合要求

來源

2014-07-09 17:41:38

「mouseuo」嗯:) – epascarello

哈哈，謝謝@epascarello指出了！這就是我不會校對的原因 –

請勿使用on/off。 jQuery有一個內置的解決方案。使用jQuery.one。它只會執行一次處理程序。

您可以使用它來偵聽第一個（也是唯一的）mouseout事件，並刪除您感興趣的任何CSS類刪除。

elem.one("mouseout", function() { $(this).removeClass("hoverClass"); })

來源

2014-07-09 18:19:39 meagar

試試這個：

HTML：

<a href="">Follow</a>

CSS：

a {background: #298be6; color: #fff; display: inline-block; font-family: Helvetica; padding: 5px 20px; text-decoration: none;} 

.cancel {background: #e64242;}

的jQuery：

$('a').on('click', function(e) { 
    e.preventDefault(); 
    $(this).addClass('cancel').text('Unfollow'); 
}).on('mouseleave', function() { 
    $(this).removeClass('cancel').text('Follow'); 
});

的jsfiddle：http://jsfiddle.net/c3UYD/

來源

2014-07-09 18:41:35

jQuery + CSS：如何檢測遊標的第一個「移出」元素？

回答

相關問題