javascript - JQuery 下拉框行为

Question

在下面的代码中，用户可以将鼠标悬停在该区域上，然后会出现一个下拉框。 用户希望当用户单击屏幕上的某处时该框消失。有没有办法使用 JavaScript 和 jQuery 来完成此任务？

代码如下...提前感谢您的回复。

<script type="text/javascript">

    $(document).ready(function () {
        $(".password").fancybox({
            'width': 500,
            'height': 260,
            'autoScale': false,
            'transitionIn': 'none',
            'transitionOut': 'none',
            'type': 'iframe'
        });



        // Login drop down
        $(".signin").hover(function (e) {
            e.preventDefault();
            $(".signin_menu").show();
            $(".signin").addClass("menu-open");
        });
        $(".signin_menu").hover(function (e) {
            e.preventDefault();
            $(".signin_menu").show();
            $(".signin").addClass("menu-open");
        });

Answer 1

尝试添加以下内容:

$('html').on('click', function() {
    $('.signin_menu:visible').hide();
});

$('.signin_menu > *').on('click', function(event) {
    event.stopPropagation();
});

如果用户点击 .signin_menu 之外的元素，.signin_menu 将被隐藏。