當文字方塊獲得焦點的時候，在文字方塊的下方顯示一個浮動圖層。 當使用者點擊除了文字方塊和浮動圖層以外的網頁空白處時，請隱藏浮動圖層。 當使用者點選浮動圖層時，就會改變文字方塊的值。 複製程式碼 代碼如下: -/html/PUBL "IC DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <BR>function $(id){ <BR>return (document. getElementById(id)); <BR>} <br><br>function show_div(evt) { <BR>var od = $('div1'); <BR>var e = window.event || evt; <BR>var o = e.srcElement || e.target; <BR>with (od.style) { <BR>display = 'block'; <BR>left = o.offsetLeft 'px'; <BR>top = o .offsetTop o.offsetHeight 1 'px'; <BR>} <BR>} <br><br>function hide_div(evt) { <BR>$('div1').style.display = 'none'; <BR>} <br><br>function control_bubble(oEvent) { <BR>//取消冒泡<BR>oEvent = oEvent || window.event; <BR>if (document.all) { <BR>oEvent.cancel = true; <BR>} else { <BR>oEvent.stopPropagation(); <BR>} <BR>}; <br><br>function fill_input(oEvent) { <BR>$('text1').value = $('div1').innerHTML; <BR>control_bubble(oEvent); <BR>} <br><br>window.onload = function() { <BR>$("text1").onfocus = show_div; <br><br>document.onclick = function() { <BR>//隱藏層<BR>hide_div(); <BR>}; <br><br>$("text1").onclick = control_bubble; <BR>$("div1").onclick = fill_input; <BR>} <BR> style="background:#666;position:absolute;overflow:auto;display:none ;padding:50px;">點我
