jquery 下拉式菜单

walden 发布于 2012/09/07 08:31
阅读 1K+
收藏 0

NGINX社区官方微服务训练营,深入了解K8s网络,线上课程+专家答疑,立即加入>>>

jquery如何用一个事件去阻止另一个事件的产生 比如我做一个下拉式子菜单 鼠标放到菜单栏上去 子菜单下拉出来 鼠标从上面移出 子菜单收回 但是鼠标移到下面的子菜单 什么也不发生 这该怎么实现
加载中
0
T
T0NYLEE
event.stopPropagation();
0
puras
puras
你可以把鼠标移出事件的范围放大到菜单栏和子菜单上。这样就好了
0
walden
walden

引用来自“puras”的答案

你可以把鼠标移出事件的范围放大到菜单栏和子菜单上。这样就好了
我就是这样做的 但是有时候会死循环  因为子菜单在收回的时候 我把鼠标移进去了 这样会产生一个mouseenter事件  但是上一个收回事件还没执行完 等它收回去的时候 又产生一个mouseleave 事件  等到它执行mouseenter的slideDown()事件时 它又会经过我的鼠标而产生mouseenter事件  就这样不停地循环  
0
walden
walden

引用来自“T0NYLEE”的答案

event.stopPropagation();
能否给点示例代码呢  谢谢
0
puras
puras

引用来自“华定平”的答案

引用来自“puras”的答案

你可以把鼠标移出事件的范围放大到菜单栏和子菜单上。这样就好了
我就是这样做的 但是有时候会死循环  因为子菜单在收回的时候 我把鼠标移进去了 这样会产生一个mouseenter事件  但是上一个收回事件还没执行完 等它收回去的时候 又产生一个mouseleave 事件  等到它执行mouseenter的slideDown()事件时 它又会经过我的鼠标而产生mouseenter事件  就这样不停地循环  

是在鼠标移出触发mouseleave事件的时候,判断鼠标的坐标是否在子菜单范围内,如果不在,则将子菜单隐藏,否则不做隐藏。

我之前写的一个处理一级菜单mouseleave事件的代码:

btn.bind('mouseleave', function(e) {
      if (opts.menu) {
        var mi = $(opts.menu);
        
        if (!((e.pageX >= mi.offset().left && e.pageX <= mi.offset().left + mi.width()) 
          && (e.pageY >= mi.offset().top && e.pageY <= mi.offset().top + mi.height()))) {
          $(opts.menu).mk_menu('hide');
        }
      }
    });

0
walden
walden

引用来自“puras”的答案

引用来自“华定平”的答案

引用来自“puras”的答案

你可以把鼠标移出事件的范围放大到菜单栏和子菜单上。这样就好了
我就是这样做的 但是有时候会死循环  因为子菜单在收回的时候 我把鼠标移进去了 这样会产生一个mouseenter事件  但是上一个收回事件还没执行完 等它收回去的时候 又产生一个mouseleave 事件  等到它执行mouseenter的slideDown()事件时 它又会经过我的鼠标而产生mouseenter事件  就这样不停地循环  

是在鼠标移出触发mouseleave事件的时候,判断鼠标的坐标是否在子菜单范围内,如果不在,则将子菜单隐藏,否则不做隐藏。

我之前写的一个处理一级菜单mouseleave事件的代码:

btn.bind('mouseleave', function(e) {
      if (opts.menu) {
        var mi = $(opts.menu);
        
        if (!((e.pageX >= mi.offset().left && e.pageX <= mi.offset().left + mi.width()) 
          && (e.pageY >= mi.offset().top && e.pageY <= mi.offset().top + mi.height()))) {
          $(opts.menu).mk_menu('hide');
        }
      }
    });

这样应该就行了 谢谢了
0
walden
walden

引用来自“华定平”的答案

引用来自“puras”的答案

引用来自“华定平”的答案

引用来自“puras”的答案

你可以把鼠标移出事件的范围放大到菜单栏和子菜单上。这样就好了
我就是这样做的 但是有时候会死循环  因为子菜单在收回的时候 我把鼠标移进去了 这样会产生一个mouseenter事件  但是上一个收回事件还没执行完 等它收回去的时候 又产生一个mouseleave 事件  等到它执行mouseenter的slideDown()事件时 它又会经过我的鼠标而产生mouseenter事件  就这样不停地循环  

是在鼠标移出触发mouseleave事件的时候,判断鼠标的坐标是否在子菜单范围内,如果不在,则将子菜单隐藏,否则不做隐藏。

我之前写的一个处理一级菜单mouseleave事件的代码:

btn.bind('mouseleave', function(e) {
      if (opts.menu) {
        var mi = $(opts.menu);
        
        if (!((e.pageX >= mi.offset().left && e.pageX <= mi.offset().left + mi.width()) 
          && (e.pageY >= mi.offset().top && e.pageY <= mi.offset().top + mi.height()))) {
          $(opts.menu).mk_menu('hide');
        }
      }
    });

这样应该就行了 谢谢了
大体思想是什么  我没看懂呢
OSCHINA
登录后可查看更多优质内容
返回顶部
顶部