jQuery 带有 Enabled/Disabled 链接的手风琴菜单

Question

我有一个逐渐演变的手风琴式菜单，现在几乎可以按我的意愿工作。它分为三个级别：国家、地区和省份。我的目标是当你点击一个国家时，它会向下滑动以显示地区。完成后，再次单击该国家/地区 links 进入新页面。类似地，点击一个地区会向下滑动省份列表，然后再次点击该地区 links 到与该地区相关的页面。

为此，我必须根据手风琴的状态让 jQuery 禁用和启用 links。我认为这可以用 preventDefault() 来完成，但我还没有成功地让它工作。

function(e){
e.preventDefault()
}

这个jSFiddle显示了我目前的进步状态。目前 "France" 上没有 link，因此区域可以向下滑动。个别地区有 link，所以目前不会显示省份。

我想我已经不远了，但所有插入 preventDefault() 行（或 return false）的尝试都未能获得预期的效果。我做错了什么？

编辑

在 Jako 的帮助下，我取得了不错的进步。原来的问题解决了。我还在底部添加了一个 "Close" 按钮，这样如果用户选择进行大量点击，他们可以保持菜单整洁和易于管理。我现在似乎只剩下一个问题了：在折叠菜单（例如，法国）并再次关闭它之后，再次单击 "France" 打开 link 而不是再次打开手风琴。换句话说，"return false" 在打开和关闭一次后不起作用。谁能从这里指导我？

我已经更新了 JSFiddle 以反映当前的进度。

Answer 1

要'override' link 操作，您可以简单地使用 "return false";

$(".leftnav a").click(
function(){
   var sub_nav = $(this).parent().find('ul').first();
   if(sub_nav.length > 0 && !sub_nav.is(":visible")) {
       sub_nav.slideDown(800);
       return false;
    }
});

在 jsfiddle 上： https://jsfiddle.net/zrhefp2p/1/

jQuery 带有 Enabled/Disabled 链接的手风琴菜单

jQuery Accordion Menu With Enabled/Disabled Links

jquery

menu

accordion