求助：怎样在鼠标点击一个input控件时弹出一个动态div

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>Document</title>
<script language="javascript">
function ShowDiv(Obj){
divDownList.innerHTML='<table id="tabList" style="width:100%" border="0" cellpadding="0" cellspacing="0"><tr><td align="right"><input type="button" value="确定" onclick="doSure()"></td></tr></table>';
var str=Obj.value;
var arr=str.split(",");
for (var i=0;i<arr.length;i++){
var newRow=tabList.insertRow(0);
var newCell=newRow.insertCell();
newCell.innerHTML='<input type="text" id="txtValue" name="txtValue" style="width:100%; background-color:#FFFFEF">';
}
divDownList.style.display="";
}
function doSure(){
var str="";
for(var i=0;i<txtValue.length;i++){
if(str!="") str+=",";
str+=txtValue[i].value;
}
txtSource.value=str;
divDownList.style.display="none";
}
</script>
</head><body>
<input name="txtSource" type="text" value="a,b,c,d" style="width:200 " onClick="ShowDiv(this)">
<div id="divDownList" style="display:none; width:150; background-color:#CCCCCC"></div>
</body>
</html>