0

我创建了一个下拉菜单，但该菜单的设计使其无需任何 HTML 知识即可轻松更改。因此，导航选项卡和下拉菜单不在同一个元素内。

此外，所有导航选项卡都是单独的元素（因此可以在没有 HTML 知识的情况下编辑、删除或创建页面），因此调用每个元素如下：

导航选项卡是：

#PageList1 ul li:first-child,
#PageList1 ul li:first-child + li
#PageList1 ul li:first-child + li + li

ETC

下拉菜单是：

#Label1
#Label2
#Label3

ETC

结果，当#PageList1 ul li:first-child 悬停时，#Label1 被触发为slideDown。ETC

为了使它在没有任何下拉菜单（#Labels）保持打开状态的情况下工作，当鼠标悬停在某些区域时，我必须在 #Label1（和所有其他 #Label id）上放置 slideUp 事件：#main、#header、或另一个#Label。

现在我正在使用条件标签处理某个页面，我需要从某个下拉菜单（#Label1）中删除所有 slideUp 事件。

有办法吗？

由于 slideUp 事件不是绑定的一部分，因此我不能使用取消绑定、分离或删除所有 slideUp 事件。

我试图让这样的事情起作用（但没有运气）：

（清除 jquery document.ready() 调用）

（防止 jQuery 就绪处理程序触发）

为了解决这个问题，我尝试克隆 #Label1 并 appendTo 一个新的 div，希望它会删除所有附加到 #Label1 的触发事件，但没有。

HTML：

<b:widget id='PageList1' locked='false' title='' type='PageList'>

然后在一个单独的 continaerr 中进一步向下是：

<b:section class='main' id='blank' showaddelement='yes'>
  <b:widget id='Label1' locked='false' title='' type='Label'>....</b:widget>
</b:section>
<b:section class='label-wrapper' id='house' showaddelement='yes'>
  <b:widget id='Label2' locked='false' title='' type='Label'>...</b:widget>
</b:section>
<b:section class='label-wrapper' id='garage' showaddelement='yes'>
  <b:widget id='Label3' locked='false' title='' type='Label'>...</b:widget>
</b:section>

ETC...

查询：

$(document).ready(function(){
    $("#PageList1 ul li:first-child a").hover(function(){
        $("#Label1").slideDown(130);   
    });
    $("#Label1").mouseleave(function(){
        $("#Label1").slideUp(130);
    });
});

ETC...

4

1 回答 1

0

我不完全理解您对整个事情的处理方法，但也许以下内容会有所帮助：

更改调用的代码，.slideUp()使其仅在没有特定类的元素上调用它，例如"noSlideUp"，然后根据需要将该类添加到元素中。所以你的mouseleave处理程序看起来像这样：

$("#Label2").mouseleave(function(){
    $("#Label1").not(".noSlideUp").slideUp(130);
});

...然后在其他地方，当您想阻止slideUp时，"#Label1"您会这样做：

$("#Label1").addClass("noSlideUp");

...如果您以后想重新启用slideUp该元素，您将再次删除该类：

$("#Label1").removeClass("noSlideUp");

这个概念有点笨拙，因为你必须在.not(".noSlideUp")所有调用 的地方包含.slideUp()，但它会做你想做的事。

于 2013-06-16T04:20:48.560 回答