點擊清除CSS菜單懸停狀態（通過ajax加載頁面）

我在網站上有一個CSS下拉菜單。沿着頂部有一個父類別列表，當你將鼠標懸停在一個上面時，出現一個下拉菜單，你可以點擊其中一個子類別。點擊清除CSS菜單懸停狀態（通過ajax加載頁面）

當您點擊子類別時，會觸發ajax頁面加載並替換頁面內容。效果很好。

但問題是，因爲頁面沒有重新加載，下拉菜單仍然存在。你必須將鼠標移開才能讓它消失。這很煩人。我們希望菜單消失，當你點擊一個兒童類別。在觸摸設備上，這種行爲更令人討厭。

而不是在這裏張貼的代碼，我會放一個網站鏈接：http://tinyurl.com/blvtlwz 有問題的菜單是一個在頂部 - 「競賽馬」「休閒馬」等

我會對檢測到點擊時如何清除懸停狀態的任何想法感興趣，或者是處理菜單的更好方法？我用jquery removeClass（）弄了個擺弄，但我沒有太多運氣。

感謝

來源

2012-12-28 dopey

你可以用這個腳本嘗試：

$(function(){ 
    $('#nav li').hover(function() { 
    $('ul',this).show(); // this will show the hidden ul 
    }); 
    $('#nav li ul li').click(function() { 
    $(this).parent().hide().end(); // this will hide the ul 
    }); 
});

來源

2012-12-28 11:46:00 Jai

。在此工作的對待，我沒有完全的sted它尚未，但迄今它看起來不錯:)非常感謝 – dopey

$(document).ready(function() { 
$('#nav li ul li').click(function() { 
    $(this).parent().fadeOut(); 
    return false; // comment this to allow propagaton to new page 
}); 
$('#nav li ul li').hover(function() { 
$(this).parent().fadeIn(); 
}); 
});

見demo

來源

2012-12-28 11:56:33 Anujith

謝謝，我給了這個去，但一旦我點擊菜單，一旦它被刪除，無法再次點擊。 – dopey

你可以用它代替。點擊

// This might need some tweeking for it to work on your end 
$('#nav li').on("click", function(e){ 
    $('#nav li').hide(); 
}); 

// When you are scrolled down a bit and click a top menu link (eg 'Competition Horses') you will "jump to top". This will prevent that. 
$('#nav ul li a').on("click", function(e){ 
    e.preventDefault(); 
});

來源

2012-12-28 12:07:50 Mackelito

我喜歡第二部分阻止跳回頂部 - 謝謝！ – dopey

點擊清除CSS菜單懸停狀態（通過ajax加載頁面）

回答

相關問題