//绑定事件处理
$(“#btnDDL”).click(function (event) {
//取消事件冒泡
event.stopPropagation();
//设置弹出层位置
var offset = $(event.target).offset();
//alert($(event.target).width());
var inID = $(this).get(0).getAttribute(“inputid”);
//依據 input 跟 button 寬度來設定 下拉選單的寬度
$(“#divPop”)[0].style.width = ($(“#” + inID).width() + $(this).width() + 10) + “px”;
//单击空白区域隐藏弹出层
$(document).click(function (event) { $(“#divPop”).hide(speed) });
//设定下拉选单显示的位置
$(“#divPop”).css({ top: offset.top + $(event.target).height() + 10 + “px”, left: offset.right });
//切换弹出层的显示状态
$(“#divPop”).toggle(speed);
});
});
</script>
</head>
<body>
<div>
<br /><br /><br />
<input name=”txtKey” type=”text” maxlength=”30″ size=”30″ id=”txtKey” style=”Padding:2px;” /><button id=”btnDDL” inputid=”txtKey” >▼</button>
</div>
<!– 弹出层 –>
<div id=”divPop” style=”background-color: #DDFFDD; border: solid 1px #000000; position: absolute; display:none;
width: 300px; height: 100px;”>
</div>
</body>
</html>
这里面 还有各 想解决的问题，就是要让 divPop 也能动态产生..
