Javascript 下拉菜单“；“Mouseleave”；

我做了一个代码，但我有一些问题，当我的鼠标在“类别1”是给我看框，我成功使它如果鼠标是要框ID从类别1按钮工作，但如果从类别我移动鼠标不同的地方不是隐藏我的框。。。希望有人能帮助我解决这个问题，我还需要什么，如果它是可能的，当鼠标离开菜单按钮和类别之前隐藏框等待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();
   }
  });

 });
});

我把代码放在这里：

试试这个

试试这个

只需隐藏所有子菜单，然后再显示正确的子菜单

$(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();
            }

        });

---

我尝试你的代码，但是如果我的鼠标从菜单按钮转到Box div，Box div将被隐藏。。。是不是保持开放我尝试这段代码是工作的，但同样的问题，如果鼠标如果在菜单按钮上，是要框div菜单是保持不变的，但如果鼠标是要从菜单按钮的例子不框div id网站的另一部分是不隐藏框。。。框是隐藏的，只是如果菜单按钮-框Div菜单-鼠标从框Div菜单，但我需要这个菜单按钮-鼠标出。。。

$(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();
            }

        });