彈出元素點擊和隱藏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時點擊

回答

相關問題