点击一个地方显示某个元素，点击其他地方隐藏某个元素实现

今天做工作的时候有一个需求，实现留言功能的业务，这个业务基本上是仿的是csdn博客的留言区功能。当点击留言文本域的时候呢发表留言的按钮会出现，点击其他的地方的时候留言按钮就会消失。

这个其实也很好实现，一开始没成功，原因是我竟然忘记了事件冒泡。。打脸打脸~所以整理了一下记录下。

首先写一下阻止事件冒泡的函数

function stopPropagation(e){

    if(e.stopPropagation){

    e.stopPropagation()//阻止非ie浏览器的时间冒泡

    }else{

    e.cancelBubble=true;//阻止ie冒泡事件

    }

}

我的业务是点击文本域的时候显示，点击页面其他地方的时候隐藏，也就是document的点击事件绑定隐藏的业务，所以呢，我这里要阻止的冒泡事件应该是点击文本域的时候阻止冒泡，因为如果冒泡到document，那点击文本域的时候也不会显示。

所以下面的代码就是文本域绑定的点击事件里阻止事件冒泡，其他按照业务来即可。

	$(".textarea").bind('click',function(e){ 
				stopPropagation(e);//调用停止冒泡方法,阻止document方法的执行
				$(this).css("height","120");
				$(".comment-btn").css("display","block")
			}); 
			$(document).bind('click',function(){ 
				$(".textarea").css("height","100");
				$(".comment-btn").css("display","none")
			}); 

好了，这样就实现了点击某一个地方显示某个元素，点击页面其他地方隐藏某个元素的业务了。