我有一个表单框,我希望它接受用户键入的值并将其写入下面的列表。我不想使用函数,这是一个挑战。
我有以下代码:
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Mi documento</title>
<script>
var valorname = document.f1.nombre.value
</script>
</head>
<body>
<form name="f1">
<input type="text" name="nombre" onchange="document.getElementById('elemento1').innerHTML=valorname">
</form>
<br><br>
<ul>
<li id="elemento1"></li>
</ul>
</body>
</html>
如您所见,我绘制了一个表单框和一个列表。正如我所说,我想要的是当在文本框中输入时,当它发生变化时,离开它时,列表元素会填充在框中输入的值。
我遇到的问题是我得到undefined
了,好像我没有保存在变量的文本框中输入的内容。我不知道这是否是运行时问题,尽管我认为 JavaScript 代码能够获取数据并将其存储在变量中;我这么说主要是因为用函数来做这件事确实有效。
正如我所说,我不想使用函数。这简直是一个挑战。
非常感谢。一切顺利。
问题是您在页面加载时检索输入的值,而它甚至还没有被创建。
您必须在更改事件发生时检索该值:
在 onchange 中,最好将值直接传递给对象,而不是传递给您在脚本中声明的变量,这样:
由于valuename变量位于head中,当 body 的内容尚未到达 DOM 时正在加载,这就是引用保持为undefined的原因。
如果您还想将值存储在变量中,您可以在脚本开头声明变量并像这样离开 onchange 事件:
因此,在启动 onchange 事件时,您会获取所述输入的值并将其存储在valuename变量中。
好的。非常感谢你们俩。这两种可能性都是有效的。唯一的问题是我没有将值存储在任何变量中,因此您将无法重用它。