[英]close horizontal drop-down menu on second click
我正在為在堆棧溢出處發現的下拉菜單編寫一些代碼: http : //jsfiddle.net/jhoffm34/VbtuC/
我有一個jQuery下拉菜單,單擊后可展開。 我試圖使用document.onmousedown再次單擊“類別”時關閉菜單,但它只是立即重新打開菜單。 有誰知道如何解決這一問題?
工作演示
http://jsfiddle.net/RguMu/show
http://jsfiddle.net/RguMu/
http://jsfiddle.net/UK9Qt/-僅在單擊類別時顯示和隱藏
因此,在第二次單擊時,您的菜單將立即關閉:
使用is(':visible')
另一個建議是,您不需要太多屬性。 只要show
和hide
,就可以更好地了解自己的要求。
jQuery代碼
if(submenu.is(':visible')){
submenu.hide();
return false;
}
完整代碼
var timeout = 999999;
var closetimer = 0;
var ddmenuitem = 0;
function jsddm_open(event) {
jsddm_canceltimer();
jsddm_close();
var submenu = $(this).find('ul');
if(submenu.is(':visible')){
submenu.hide();
return false;
}
if (submenu) {
ddmenuitem = submenu.css('visibility', 'visible');
ddmenuitem = submenu.css('position', 'relative');
submenu.show();
return false;
}
return true;
}
function jsddm_close() {
if (ddmenuitem) ddmenuitem.css('visibility', 'hidden');
if (ddmenuitem) ddmenuitem.css('position', 'fixed');
}
function jsddm_timer() {
closetimer = window.setTimeout(jsddm_close, timeout);
}
function jsddm_canceltimer() {
if (closetimer) {
window.clearTimeout(closetimer);
closetimer = null;
}
}
$(document).ready(function() {
$('#jsddm li').bind('click', jsddm_open);
$('#jsddm > li').bind('mouseout', jsddm_timer);
$('#jsddm > li').bind('mouseover', jsddm_canceltimer);
$('#jsddm li').find('ul').hide();
});
document.onmousedown = jsddm_close;
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.