基于jquery鼠标点击其它地方隐藏层的实例代码

效果图:

下面的代码运行后，需要再刷新一下。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>test</title> 
<style type="text/css"> 
.div_d{ padding:10px; border:1px dotted red; position:absolute; display:none; cursor:pointer;} 
</style> 
<script src="http://demo.jb51.net/jslib/jquery/jquery.js"></script> 
<script type="text/javascript"> 
$(function(){ 
$("input[id=search]").focus(function(even){ 
var pos=$(this).offset();

$(".div_d").css({left:pos.left,top:pos.top+20+"px",display:"block"}); 
}); 
document.onclick=function(e){

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]