如何從點擊

觸發「的onmouseout」所以這是一個非常簡單的問題，但研究它，我只能找到答案，更復雜的情況。這裏是我的：如何從點擊

我有，當你在它懸停，面板將顯示其下方（使用CSS大部分）母版頁上的圖像和麪板中有鏈接。因爲主頁面是相同的，所以單擊這些鏈接正確地合併下面的新內容頁面，但面板保持可見狀態，直到您將鼠標移出面板，並且它覆蓋了一些內容。

我想要的是該鏈接的onClick事件也會觸發onMouseOut，以便在單擊鏈接時，面板會再次隱藏自身，直到圖像再次懸停爲止。我已經得到了JavaScript的經驗體面的數額，但它好像應該是這樣做...像增添了li或錨標記的onClick:onMouseOut()一個更簡單的方法，但我有一個很難搞清楚如何實際上寫它...想法？

來源

2014-02-18 Jon

只是調用相同的'function'的onclick和onmouseout，不是嗎？ – Skwal

它現在都是通過css完成的，所以我實際上並沒有在任何地方調用onClick。 – Jon

我發現了一個更簡單的方法...

$(document).ready(function() { 
    $("a").click(
    function() { 
    $(this).closest(".drop").trigger(onmouseout); 
    }) 
    });

這只是增加了mouseout事件的每一個被點擊的是錨......所以它可能有點矯枉過正，但我無法想象我的頁面中有一個用戶點擊鏈接的場景，我們希望保持菜單打開。

來源

2014-02-19 18:46:02 Jon

在瀏覽器兼容性方面，這個答案實際上是最推薦的一個。但你沒有要求jQuery的解決方案:) – Blauharley

高度瞭解兼容性...我剛開始Firefox的鉻等測試...對不起提及jQuery ...我是一個新手到客戶端腳本，所以有時我忘了包括/做出區別... – Jon

只是一個笑話:)你自己找到了解決方案，這是最重要的事情。 – Blauharley

你試過在點擊觸發的一類，並使用類刪除，顯示懸停面板的功能？因此，例如，在點擊時添加類「隱藏」。然後：

.panel.hide { 
    display: none; 
}

來源

2014-02-18 20:22:29 apohl

如果我這樣做，我可以立即刪除它後？這一切都是通過css現在完成的，所以我認爲添加該類會隱藏它，然後刪除該類在技術上不會重新顯示它，直到我再次在圖像上再次懸停爲止。 – Jon

我知道這有點冒失，但是，是的，這是一個選項。 – apohl

你可以使用createElement方法來解決這個問題：

// Create the event. 
var eventMouseOut = document.createEvent('MouseEvents'); 

// Define that the event name is 'mouseout'. 
eventMouseOut .initMouseEvent('mouseout', true, true,...); 

// Listen for the event. 
document.getElementById(...).addEventListener('click', function (e) { 

    // handle click 
    ... 
    ... 

    // dispatch mouseout-event 
    document.getElementById('panel-id').dispatchEvent(eventMouseOut); 

}, false);

dispatchEvent可以稱爲不管你想要像的onClick處理程序內。 Pleale注意到addEventListener是舊IE版本不支持的。來源： https://developer.mozilla.org/en-US/docs/Web/API/document.createEvent

類似的問題和答案：

來源

2014-02-18 20:27:57 Blauharley

因此，讓我看看，如果我理解這是如何工作的： – Jon

我得到的那種困惑中......中途因此，讓我看看，如果我理解這是如何工作的：創建與參數「MouseEvents」的事件。然後用參數（'mouseout'，true，true）調用initMouseEvent函數（我是否需要...用於第四個參數？），然後我可以添加一個事件監聽器，比如所有的錨標籤......然後我可以將其設置爲偵聽點擊事件？然後調用一個觸發'mouseout'事件的函數？前兩個步驟是有道理的，但我正在努力爭取第二個......你能解釋一下嗎？或添加更多的細節？ – Jon

上面的例子只是你可以用Costum MouseEvents做什麼的可能性。據我瞭解你的問題，你想觸發另一個事件發生點擊時，對吧？然後，我會建議您在點擊處理程序中使用dispatchEvent-methode。忘記addEventListener示例。 – Blauharley

回答

相關問題