javascript - HTML 表单文本 onkeyup

标签 javascript html forms onkeyup

此代码将用户在框中键入的内容更改为大写,并在框中显示结果。

<html>
<head>
<script type="text/javascript">
function upperCase(x)
{
   var y=document.getElementById(x).value;
   document.getElementById(x).value=y.toUpperCase();
   document.getElementById("mySpan").value=y.toUpperCase();

}
</script>
</head>
<body>

Enter your name: <input type="text" id="fname" onkeyup="upperCase(this.id)">
<br/>
<span id="mySpan"></span>

</body> </html>

但是我怎样才能让它显示在文本框下面呢?以及当用户键入时,大写文本显示在文本框下方?

谢谢!

最佳答案

我会建议以下更易于维护的方法,它使用 event registration model而不是 inline model :

JS:

<script>
document.getElementById("fname").onkeyup = function() {
    document.getElementById("mySpan").innerHTML = this.value.toUpperCase();   
}
</script>

标记:

Enter your name: <input type="text" id="fname"/>
<br/>
<span id="mySpan"></span>

演示:http://jsfiddle.net/karim79/GPZ8h/

关于javascript - HTML 表单文本 onkeyup,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4362291/

相关文章:

javascript - HTML5 中的 TCP/IP 套接字通信

javascript - 尝试从数组的下拉列表中提取值

javascript - jQuery SerializeArray — 如何排除带有空 <opiton> 值的 <select>?

javascript - 使用 Greasemonkey 添加表单标签

ruby-on-rails - 如何在此 ruby​​ 表单中发出错误通知?

javascript - 使用附加 SDK 在 Firefox 中自定义上下文菜单?

javascript - 调整图像大小以保持在视口(viewport)内

javascript - 如何替换此 JavaScript 语句中的所有字符串值?

javascript - 如何旋转div Html层?

javascript - 在 Javascript 中检索表单的 "name"属性,而名称为 "name"的输入存在