弹出元素点击和隐藏HTML时点击

我有以下的HTML代码：弹出元素点击和隐藏HTML时点击

<a href="#language">English</a> 
<div class="popup" id="language"> 
    Portuguese | English | French 
</div>

我想打开/关闭格，当我点击链接。

但我还需要以下行为：

1 - 当我点击弹出窗口应隐藏链接之外的某处。

2 - 当我打开一个弹出窗口时，我想要任何当前打开的弹出窗口关闭;

我试过如下：

$('a').click(function (event) { 
    event.preventDefault(); 
    $($(this).attr('href')).toggle(); 
}); 
$("html").click(function (event) { 
    $("div.popup").hide(); 
});

但HTML部分对我的代码停止工作。

下面是一个例子：http://codepen.io/mdmoura/pen/sAeEJ

我怎样才能解决呢？

谢谢你，米格尔

来源

2013-10-04 Miguel Moura

问题是事件传播

$('a').click(function (event) { 
    $($(this).attr('href')).toggle(); 
    return false; 
}); 
$("html").click(function (event) { 
    $("div.popup").hide(); 
});

演示：Fiddle

来源

2013-10-04 10:26:19

我看看......我虽然 “返回false” 和 “的preventDefault” 两种方法做同样的事情。是否有可能确保只有一个弹出窗口是打开的。我更新了我的示例：http://codepen.io/mdmoura/pen/sAeEJ。现在通过点击这两个链接，我可以打开两个弹出窗口。我想在我打开一个新的弹出窗口时关闭所有弹出窗口。 –

@MDMoura不，他们不是..'返回false' ==防止默认和停止传播 –

我明白了。谢谢......我刚刚解决了另一个问题。我添加了$（“div.popup”）。hide（）;在切换前点击。谢谢 –

弹出元素点击和隐藏HTML时点击

回答

相关问题