所以,我正在尝试打印出一个添加了用户输入文本的数组,但我要打印出来的是数组的有序列表.正如您所看到的,(如果您运行我的代码)列表项只是不断添加用户输入,并且没有添加带有人名的新列表项.请帮忙!以下是代码:
<!DOCTYPE html>
<html>
<head>
First name: <input type="text" id="firstname"><br>
<script type="text/javascript">
var x= [];
function changeText2(){
var firstname = document.getElementById('firstname').value;
document.getElementById('boldStuff2').innerHTML = firstname;
x.push(firstname);
document.getElementById('demo').innerHTML = x;
}
</script>
<p>Your first name is: <b id='boldStuff2'></b> </p>
<p> Other people's names: </p>
<ol>
<li id = "demo"> </li>
</ol>
<input type='button' onclick='changeText2()' value='Submit'/>
</head>
<body>
</body>
</html>
Fel*_*ing 61
如果要li为每个输入/名称创建元素,则必须使用document.createElement [MDN]创建它.
给列表ID:
<ol id="demo"></ol>
并获得它的参考:
var list = document.getElementById('demo');
在事件处理程序中,使用输入值作为内容创建一个新的列表元素,并使用Node.appendChild [MDN]附加到列表:
var firstname = document.getElementById('firstname').value;
var entry = document.createElement('li');
entry.appendChild(document.createTextNode(firstname));
list.appendChild(entry);
尝试这样的事情：
var node=document.createElement("LI");
var textnode=document.createTextNode(firstname);
node.appendChild(textnode);
document.getElementById("demo").appendChild(node);
小提琴：http : //jsfiddle.net/FlameTrap/3jDZd/
我最近遇到了同样的挑战，偶然发现了这个线程，但是发现了一个使用append的简单解决方案。
var firstname = $('#firstname').val();
$('ol').append( '<li>' + firstname + '</li>' );
存储名字值，然后使用append该值添加为一个li到ol。我希望这有帮助 ：）
| 归档时间： |
|
| 查看次数： |
114868 次 |
| 最近记录： |