JS代码
'use strict';
$(document).ready(function() {
});
function change() {
document.getElementById('the-name').innerHTML = document.getElementById('name');
}
HTML代码
<p> What's your name? <input type="text" placeholder="Name" id = "name"></input></p>
<button id="button" onclick= "change(document.getElementById('name'))"> Answer </button>
<p>Hello <span id = "the-name"></span>,</p>
使用上面的代码,每当我尝试通过单击按钮运行它时,我都会在标题中得到结果。有人可以通过告诉我我做错了什么来指出我正确的方向吗?非常感谢,谢谢!
最佳答案
您的问题是您将 HTMLInputElement
分配给元素的 innerHTML
而不是 text
或 HTML 内容
在行中:
document.getElementById('the-name').innerHTML = document.getElementById('name');
需要获取输入值:
document.getElementById('the-name').innerHTML = document.getElementById('name').value;
演示:
'use strict';
$(document).ready(function() {});
function change() {
document.getElementById('the-name').innerHTML = document.getElementById('name').value;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p> What's your name? <input type="text" placeholder="Name" id="name"></input>
</p>
<button id="button" onclick="change(document.getElementById('name'))"> Answer </button>
<p>Hello <span id="the-name"></span>,</p>
关于javascript - 结果取回 [object HTMLInputElement],我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47547922/