0

我编写了一个代码，但我遇到了一些问题，当我的鼠标在“类别 1”上时，我会显示该框，如果鼠标要从类别 1 按钮进入框 ID，我成功制作它但如果从类别我移动鼠标不同的地方不是隐藏我的盒子......希望有人能帮我解决这个问题，如果可能的话，当鼠标离开菜单按钮和类别之前，我仍然需要什么来隐藏盒子等待 1 秒或 2，如果在 1 或 2 秒内鼠标返回框显示回来

这是我现在制作的 js 代码...

$(document).ready(function(){
 $("a[id*='DropDown_Menu_ID_']").hover(function() {
  var DropDown_ID        = $(this).attr("id");
  var ID_Split           = DropDown_ID.split('_');
  var Box_Data_ID        = ID_Split[3];

  var Button_Value       = $('#DropDown_Menu_ID_' + Box_Data_ID).attr("value");

  var count              = 0;

  count++;
  $('#DropDown_Box_ID_' + Box_Data_ID).show();



  $('#DropDown_Box_ID_' + Box_Data_ID).mouseleave(function() {
   count--;
   if (!count) {
    $('#DropDown_Box_ID_' + Box_Data_ID).hide();
   }
  });

 });
});

我把代码放在这里：http: //jsfiddle.net/eANHr/

4

2 回答 2

0

尝试这个

http://jsfiddle.net/eANHr/1/

$(document).ready(function () {
            $("a[id*='DropDown_Menu_ID_']").hover(function () {

                var DropDown_ID = $(this).attr("id");
                var ID_Split = DropDown_ID.split('_');

                var Box_Data_ID = ID_Split[3];

                var Button_Value = $('#DropDown_Menu_ID_' + Box_Data_ID).attr("value");



                $('#DropDown_Box_ID_' + Box_Data_ID).show();
            })
            $("a[id*='DropDown_Menu_ID_']").mouseleave(function () {


                var DropDown_ID = $(this).attr("id");
                var ID_Split = DropDown_ID.split('_');

                var Box_Data_ID = ID_Split[3];
                $('#DropDown_Box_ID_' + Box_Data_ID).hide();



            });
        });
于 2013-07-04T08:06:02.967 回答
0

试试这个链接

只需在显示正确的子菜单之前隐藏所有子菜单

$(document).ready(function () {
            $("a[id*='DropDown_Menu_ID_']").hover(function () {
                hideAll();

                var DropDown_ID = $(this).attr("id");
                var ID_Split = DropDown_ID.split('_');
                var Box_Data_ID = ID_Split[3];

                var Button_Value = $('#DropDown_Menu_ID_' + Box_Data_ID).attr("value");

                var count = 0;

                count++;
                $('#DropDown_Box_ID_' + Box_Data_ID).show();

                $('#DropDown_Box_ID_' + Box_Data_ID).mouseleave(function () {
                    count--;
                    if (!count) {
                        $('#DropDown_Box_ID_' + Box_Data_ID).hide();
                    }
                });

            });

            function hideAll() {
                $('div[id^="DropDown_Box_ID"]').hide();
            }

        });
于 2013-07-04T08:14:47.913 回答