JS事件控制

說明：我習慣使用jQuery來輔助我完成不少事情。因此此篇文章針對個人解決方案均採用jQuery。

示例1、事件冒泡（對於父親元素和子元素均設置的事件）

描述：在一個對象上觸發某類事件（好比單擊onclick事件），若是此對象定義了此事件的處理程序，那麼此事件就會調用這個處理程序，若是沒有定義此事件處理程序或者事件返回true，那麼這個事件會向這個對象的父級對象傳播，從裏到外，直至它被處理（父級對象全部同類事件都將被激活），或者它到達了對象層次的最頂層，即document對象（有些瀏覽器是window）。

解決辦法：

$('#targe').click(function(e){
    // do something
    e.stopPropagation(); // 阻止事件冒泡
})

示例2、點擊其餘區域，處理目標對象的效果

描述：當設置了一個元素，好比autocomplete，在文本輸入的時候，出現提示信息。原本能夠經過離開焦點的時候，來關閉提示信息。可是對於提示的信息，我須要選擇，選擇的時候，無形中將離開元素焦點。
因爲事件的相互影響，沒法正確的處理此效果。

解決辦法：經過給document添加單擊事件，當點擊頁面區域，則處理當前元素是否在我須要操做的區域內，不在，則中止個人操做。代碼以下：

$(document).mousedown(function(e) {
	var target = e.target || e.srcElement;
	var rp = $(target).parents('.ci_autocomplete_box'); // 判斷當前鼠標點擊的元素是否在容器
        // 不在指望的容器內，則進行效果關閉操做 
	if (rp.length == 0) {
		$('.ci_autocomplete').hide();
	}
	e.stopPropagation();
});

以上，是最近在處理事件的時候，但願相互交流。