Question

我不能为我的生活弄清楚为什么以下不起作用。我从W3school示例中here采取了if。

基本上我想在输入文本更改时从输入文本中获取值，并修改另一个div以包含该值。我只希望div显示新值，但我确实希望它每次都改变它，所以我认为onchange是要走的路。

    <!DOCTYPE html>
<html>
<head>
<script>
function myFunction()
{
var div = document.getElementById('divID');
div.innerHTML = div.innerHTML + x.value;
}
</script>
</head>
<body>

Enter your name: <input type="text" id="fname" onchange="myFunction()">
<p>When you leave the input field, a function is triggered which transforms the input text to upper case.</p>

<div id="divID"></div>

</body>
</html>

提前感谢您对此提供的所有帮助。

Answer 1

你有两个问题，首先是x未定义。第二，你应该使用另一个触发器来实现这一点。

试试这个：

    function myFunction()
    {
        var input = document.getElementById('fname')
        var div = document.getElementById('divID');
        div.innerHTML = div.innerHTML + input.value;
    }

并将您的HTML更改为：

<input type="text" id="fname" onkeypress="myFunction()">

Answer 2

您的函数中未定义

x，它应为document.getElementById('fname')。

如果您想在每次按键时更改div，请使用onkeyup或onkeypress代替onchange。

Answer 3

如果我能正确理解您的问题，您可以将x.value更改为document.getElementById("fname").value。

Answer 4

好的，请查看 - http://jsfiddle.net/2ufnK/2/

问题是你需要在这里定义x，

var x = document.getElementById("fname");

x现在引用了html对象。

然后你可以调用“.value”方法来获取它的文本。然后其他一切都按照你写的方式工作。

Answer 5

<head>
    <script type="text/javascript">
        function input(){
            var input_taker = document.getElementById('email').value;
            document.getElementById('display').innerHTML = input_taker;
        }
    </script>


</head>

<form method="post" action="#">
<input type="text" name="email" placeholder="email@example.com" id="email"  onchange="input()">
<input type="submit" name="save" value="save">

</form>
<div id="display"></div>

获取输入值并显示在另一个div中

5 个答案: