jquery - 单击网页内容时如何折叠 dropkick 下拉菜单并关闭菜单？

Question

我已经尝试在我的网页中使用以下代码来显示下拉菜单。我用过drop kick js。我正在使用 jquery 1.9 版本。

下拉在 IE 中工作正常，但在 chrome 中无法正常工作。

我的代码是

        if ($.browser.msie) {
            $('body').click(function (event) {
                if (!$(event.target).parents('.dk_container').length || $(event.target).parent().attr('id') != $dk.attr('id')) {
                    _closeDropdown($dk);
                }
            });
        }
        else {
            $dk.bind('focus.dropkick', function (e) {
                $dk.addClass('dk_focus');
            }).bind('blur.dropkick', function (e) {
                $dk.removeClass('dk_open dk_focus');
            });
            $(document).click(function(){
                $('.dk_open').removeClass('dk_open');
            });
        }

在 chrome 中，我可以打开下拉菜单，如果我在菜单之外单击，下拉菜单会关闭。但我无法通过单击下拉菜单来折叠菜单。

我的页面有多个下拉菜单。

Answer 1

我已经尝试了以下，它的工作正常

        $dk.bind('focus.dropkick', function (e) {
            $dk.addClass('dk_focus');
        }).bind('blur.dropkick', function (e) {
            $dk.removeClass('dk_open dk_focus');
        });
        $('body').click(function (event) {
            if (!$(event.target).parents('.dk_container').length || $(event.target).parent().attr('id') != $dk.attr('id')) {
                _closeDropdown($dk);
            }
        });

Answer 2

批准的建议对我不起作用。在您希望 dropkick 下拉关闭的任何事件上，使用传递的选择字段创建 dropkick 对象并.close()在事件的回调中调用该对象：

$('.style').click(function(event) {
  new Dropkick('#the-dropdown').close()
})