テキスト ボックスにフォーカスが置かれると、テキスト ボックスの下にフローティング レイヤーが表示されます。 ユーザーが Web ページ上のテキスト ボックスとフローティング レイヤーを除く空白スペースをクリックしたときに、フローティング レイヤーを非表示にします。 ユーザーがフローティングレイヤーをクリックすると、テキストボックスの値が変更されます。 コードをコピー コードは次のとおりです: ="Content-Type" content="text/html; charset=utf-8"> <br>function $(id) { <br>return (document.getElementById(id)) ; <br>} <br><br>function show_div(evt) { <br>var od = $('div1'); <br>var o = e; .srcElement || e.target; <br>with (od.style) { <br>left = o.offsetLeft 'px '; 1 'px'; <br>} <br>} <br><br>関数 Hide_div(evt) { <br>$('div1').style.display = 'none'; <br>function control_bubble(oEvent) { <br>//バブリングをキャンセルします<br>oEvent = oEvent || window.event; <br>if (document.all ) { <br>oEvent.cancelBubble = true; } 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 = <br><br> document.onclick = function() { <br>//非表示レイヤー<br>hide_div(); <br>}; <br><br>$(" text1").onclick = control_bubble; div1").onclick = fill_input; <br>} <br> style="background :#666;position:absolute;overflow:auto;display: none;padding:50px;">クリックしてください
