js點擊頁面其它地方將某個顯示的DIV隱藏_javascript技巧

實作也很簡單，但要注意的是，在點擊顯示的事件中，需要做阻止事件冒泡的處理，否則就觸發頁面的點擊事件了。但這樣做也有一個缺點，即如果同一個頁面中如果也有事件阻止冒泡，則不能隱藏DIV，所以在這樣的事件中需要特殊處理下：自己調用隱藏下DIV（但正常來說這樣的事件並不多）;
JS:

複製程式碼 程式碼如下:

程式碼如下:


$🎜> ).ready(function() {
//語言頭部的點擊事件，顯示語言列表
$(".language_selected").click(function(e) {
$(".language_list" ).toggle();
e.stopPropagation(); //阻止事件冒泡，否則事件會冒泡到下面的文檔點擊事件
});
//點擊文檔時，隱藏語言列表
$(document).click(function() {
$(".language_list").hide();
});
//點擊語言清單中的語言項目時，更新選取項，並隱藏語言清單
$(".language_list li").click(function() {
$(".language_selected").text($(this).text());
$(".language_list").hide();
});
$("#noPopEvent").click(function(e) {

e.stopPropagation();
});
});

CSS:

複製程式碼

複製程式碼



複製程式碼


程式碼如下:


.language_selected
{
cursor: pointer;

}
.language_list
{

border: 1px solid 1 月; } .language_list li { cursor: pointer; border: 1px solid red; }

HTML:


複製程式碼


程式碼如下:

中文(簡體)

中文(簡體)

English

點選我，不隱藏語言清單,需要自己顯示DIV