Question

我用em标签在图像上写了一些文字。我想提供某种功能，以便当用户键入文本框时，此文本会覆盖图像。我怀疑应该将哪个事件监听器添加到文本框中，以便只要更改文本框的内容，它就可以更改图像的内容。我只需要知道这可以通过事件监听器完成，或者需要更多东西。我知道如何更改图像中的文本，但无法找出如何动态更新此图像文本。希望我很清楚问题

Answer 1

textBox.addEventListener('change', function () { ... });

如果您在用户完成后出现，可以使用：

textbox.addEventListener('blur', function () { ... });

Answer 2

试试这个：

<html>
  <body>
    <input type="text" id="submit"/>
    <em id="toChange" >asd</em>
  </body>
</html>

和jQuery是：

$('#submit').change(function() {
   $('#toChange').text( $('#submit').val());  
});

或使用此jsFiddle

Answer 3

这是使用纯javascript的另一种替代方法。

在文本框中添加onkeyup并调用您提供的函数。

<input type="text" id="tbMain" onkeyup="keyup();">

当按下该键时，它将调用function keyup()

See more at here.

Answer 4

尝试onchange（）事件监听器。我认为它会起作用

在html中更新图像上的文本

4 个答案: