Question

我正在实现一个调用JavaScript函数的onkeyup输入文本。我必须将该文本放在图像上，所以我想在图像上的div中使用innerHtml。

div：

<div id="image3" style="position:absolute; overflow:hidden; left:519px; top:423px; width:474px; height:205px; z-index:4">
  <div id="uno" style="z-index:20">
      <img src="images/base-personalizzazione.png" alt="" title="" border=0 width=474 height=205>
    </div>
</div>

输入：

<input name="formtext1" id="ft1" style="position:absolute;width:571px;left:319px;top:194px;z-index:6" onkeyup="go(this.value)">

JavaScript：

<script type="text/javascript">
   function go(asd){
      document.getElementById('uno').innerHTML=asd;
   }
</script>

当我在内部写入输入时，文本图像将消失，文本将以背景白色显示。你可以帮我解决为什么会发生这种情况以及我能做些什么呢？

Answer 1

设置innerHTML会删除div中的内容。解决此问题的一种方法是将html更改为

<div id="image3" style="position:absolute; overflow:hidden; left:519px; top:423px; width:474px; height:205px; z-index:4">
  <div id="uno" style="z-index:20">
    <div id="input"></div>
    <img src="images/base-personalizzazione.png" alt="" title="" border=0 width=474 height=205>
  </div>
</div>

然后在输入div上使用innerhtml。

如何使用innerHTML将文本放在图像上？

1 个答案: