Jquery - 点击外部和隐藏Div [英] Jquery - Click outside and Hide Div

问题描述

我使用的是： http://www.useful-dates.com/search/

如何编写脚本来说，
1.当用户单击输入时，会显示滚动的div。
2.当用户点击滚动的div之外时，滚动的div隐藏。

How should the script be written to say, 1. When the user clicks the input, the scrolled div is shown. 2. When the user click outside of the scrolled div, the scrolled div hides.

像这样，但我没有运气重写脚本： http://rob-bell.net/static/ddlist.html

Like this, but i have had no luck re-writting the script: http://rob-bell.net/static/ddlist.html

Iv在网上搜索并尝试过各种各样的事情，没有运气，请帮忙？

Iv searched and tried all kinds of things on the net and no luck, please help?

推荐答案

这样做的最简单的方法是当你的脚本被触发显示列表（滚动的div），它创建一个触发器的文档本身的点击事件。这样的东西：

The easiest way of doing this is when your script is triggered to display the list (the scrolled div) it creates a trigger to the click event on the document itself aswell. Something like this:

$("selector to your div").click(function() {
    var scrolledDiv = $("selector to your scrolled div");
    scrolledDiv.show();
    $(document).one(function() {
        scrolledDiv.hide();
    });
});

使用 one（）隐藏滚动列表只会执行一次，所以它不会在每次用户单击文档时运行。但请记住，如果您不希望停止点击事件的传播，也会触发您在滚动div内的点击。

By using the one() the code to hide the scroll list will only be executed once, so it wont run each time the user is clicking the document. But remember that it will also trigger on clicks inside your scrolling div, if you dont want that stop the propagation of the click event like this:

$("selector to your scrolled div").click(function(e) {
    e.stopPropagation();
});

这篇关于Jquery - 点击外部和隐藏Div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！