javascript - 通过 javascript 添加 HTML 控件

Question

有些东西在躲避我……这似乎很明显，但我不太明白。

我想在用户更改下拉列表的值时向页面(普通旧 html)添加/删除几个 HTML 控件。一个示例是为请求的每个(多个)房间添加或删除“此房间中的客人数量”文本框......

所以如果用户选择:

1个房间，有一个文本框

2个房间，有两个文本框

3个房间，三个文本框

回到2个房间，两个文本框

等等...

Answer 1

如果直接使用 DOM 和 Javascript，您可能想要修改包含文本框的 DOM 对象的 InnterHtml 属性...很可能是一个 div。所以它看起来像:

var container = document.getElementById("myContainerDiv");
var html;
for(var i = 0; i < selectedRooms; i++)
{
    html = html + "<input type=text ... /><br />";
}
container.innerHtml = html;

使用像 jQuery 这样的 Javascript 库可以使事情稍微简单一些:

var html;
for(var i = 0; i < selectedRooms; i++)
{
    html = html + "<input type=text ... /><br />";
}

$("#myContainerDiv").append(html);