DIV怎么顯示時，變成整頁都空白了呢？

Question

<asp:TextBox id="beginTime" Width="80" runat="server"  BorderStyle="Groove" Text="08:30" onfocus="DisDiv()"/>
......
function DisDiv()
{
  document.write("<div id='warp' style='position:absolute;z-index:9999;left:81px;top:3px;width:144;height:193;tomargin:50;leftmargin:10;background-color:#dddddd;'>");
  document.write("<div id='column1'>这里是第一列</div>");
  document.write("<div id='column2'>这里是第二列</div>");
  document.write("</div>");
}

Answer 1

當我點擊TextBox時，顯示Div了，但同時TextBox不在了，Div之外的地方空白一片，這是什麼回事呢？第一次通過javascript來控制Div,不明白一回什麼事啊，請大家幫幫忙，謝謝!

Answer 2

当然了，你点击文本框后，就把原文本框换成 DisDiv 里的内容了。你可以再创建一个div，然后点击DisDiv后，把这个div的innerHTML设为你函数中的内容就可以了：<asp:TextBox id="beginTime" Width="80" runat="server"  BorderStyle="Groove" Text="08:30" onfocus="DisDiv()"/>//这里增加一个div，放在你希望显示的地方
<div id="showme"></div>......
function DisDiv()
{
    document.getElementById("showme").innerHTML = "<div id=\"warp\">....</div>";
}

Answer 3

是不是这样function DisDiv() 
{  divMain.innerHTML = "<DIV id='warp' style='position:absolute;z-index:9999;tomargin:50;leftmargin:10;background-color:#dddddd;'>"; 
divMain.innerHTML  += "<DIV id='column1'>这里是第一列</DIV>"; 
divMain.innerHTML  +="<DIV id='column2'>这里是第二列</DIV>";
divMain.innerHTML  +="</DIV>";
}
<ASP:TEXTBOX id="beginTime" width="80" runat="server" borderstyle="Groove" text="08:30" onfocus="DisDiv()" />
<DIV id="divMain"></DIV>

Answer 4

方法一：你应该用innerHTML来更换一个div的显示内容，而不是直接在页面上输出:
预先放一个空的div:
<div id="warp"></div>
function DisDiv()
{
  document.getElementById("warp").innerHTML = "输出内容...";
}
方法二：
预先定义层，让它处于隐藏状态：
<div id='warp' style='display:none'>
  <div id='column1'>这里是第一列</div>
  <div id='column2'>这里是第二列</div>
</div>
然后在函数中激活显示：
function DisDiv()
{
  document.getElementById("warp").style.display = "";
}

Answer 5

謝謝大家！to tigerhu76(虎虎)，luck0235(风平浪静时人人都能掌舵)能不能在代碼中寫<div id="showme"></div>,一定要事先弄一個嗎？

Answer 6

為什麼事先弄的與用javascript代碼控制的就不一樣了呢？幫我解解惑，謝謝大家!

Answer 7

document.write ---->  在浏览器中显示信息(文本或html) －－ 原来的已显示的信息被替换了
divMain.innerHTML=... -----> 是在浏览器中的页面的div里显示信息(文本或html)，不会涉及div以外的信息显示

Answer 8

<div id="showme"></div>
<script language=javascript>
function test()
{
  document.all.showme.innerHTML="你要显示的HTML";
}
function test1()
{
  if(document.all.showme.style.display=="")
  {
    document.all.showme.style.display=="none";
  }
  else
  {
    document.all.showme.style.display=="";
  }
}
</script>
你可以试试上面的语句 应该有用

Answer 9

to q_po_o(两个人) 明白，謝謝！to chenjun_xu2003() 我試試看看，謝謝了。

Answer 10

可以了，謝謝大家。1,那我又怎樣動態調整他的top位置呢，比如在beginTime下的10px2,我怎樣設置當mouse離開div的區域時就隱藏呢？謝謝！

Answer 11

用这个控制显示和隐藏
<div onmouseover="" onmouseout="" .......