javascript - 隐藏背景点击时的div

Question

我有一系列在链接点击时显示的 div。当显示时，我试图让它们在后台点击时关闭，同时保持它们在点击不同链接时让不同的 div 相互替换的能力。

JS在这里摆弄:http://jsfiddle.net/t593pyg9/3/

$(document).ready(function () {
    $('.toggle').hide();
    $('a.togglelink').on('click', function (e) {
        e.preventDefault();
        var elem = $(this).next('.toggle')
        $('.toggle').not(elem).hide();
        elem.toggle();
    });
});

Answer 1

监听整个文档的点击，为了防止在点击链接后由于事件传播而关闭“弹出窗口”，请向显示点击监听器添加 return false; 。

$('.toggle').hide();
$('a.togglelink').on('click', function (e) {
    e.preventDefault();
    var elem = $(this).next('.toggle')
    $('.toggle').not(elem).hide();
    elem.toggle();
    return false;
});
$(document).on('click',function(e){
    $('.toggle').hide();
});

Fiddle

<小时/>

更新

如果您想防止弹出窗口在单击时隐藏，请添加以下内容:

$('.toggle').on('click', function (e) {
    return false;
});

New Fiddle