Javascript 按钮将多个下拉列表中的选定项复制到文本框
我正在尝试将多个下拉列表的选择复制到文本框中。目前我在下面编写的代码只会复制第一个下拉列表。我希望所有四个下拉列表中的每个选项都复制到文本框中的一行中，并能够添加多个变体来创建一个列表。有什么建议吗 此外，我还想尝试更进一步，让第二个和第三个下拉列表根据之前的下拉选择动态更改。例如，在下拉列表1中选择Building One会将下拉列表2更改为仅显示Dept.One。这是一个多一点的工作，所以如果有人能告诉我如何集成这两个功能的正确方向，我将不胜感激 提前感谢您的帮助Javascript 按钮将多个下拉列表中的选定项复制到文本框,javascript,html,drop-down-menu,Javascript,Html,Drop Down Menu,我正在尝试将多个下拉列表的选择复制到文本框中。目前我在下面编写的代码只会复制第一个下拉列表。我希望所有四个下拉列表中的每个选项都复制到文本框中的一行中，并能够添加多个变体来创建一个列表。有什么建议吗 此外，我还想尝试更进一步，让第二个和第三个下拉列表根据之前的下拉选择动态更改。例如，在下拉列表1中选择Building One会将下拉列表2更改为仅显示Dept.One。这是一个多一点的工作，所以如果有人能告诉我如何集成这两个功能的正确方向，我将不胜感激 提前感谢您的帮助 函数复制（）{ var
函数复制（）{
var sel=document.getElementById（“名称”）；
var text=sel.options[sel.selectedIndex].value；
var out=document.getElementById（“输出”）；
out.value+=文本+“\n”；
}
无标题
一号楼
二号楼
三号楼
四号楼
第一部门
二部
第三部门
第四部门
文件夹一
文件夹二
文件夹三
文件夹四
只读
读+写
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
</head>
<body>
<div ng-app="" ng-controller="textboxController">
<select id="names" style="vertical-align: top;" ng-model="master.building">
<option value="Building One" selected>Building One</option>
<option value="Building Two">Building Two</option>
<option value="Building Three">Building Three</option>
<option value="Building Four">Building Four</option>
</select>
<select id="names" style="vertical-align: top;" ng-model="master.department">
<option value="Dept One" selected>Dept One</option>
<option value="Dept Two">Dept Two</option>
<option value="Dept Three">Dept Three</option>
<option value="Dept Four">Dept Four</option>
</select>
<select id="names" style="vertical-align: top;" ng-model="master.folder">
<option value="Folder One" selected>Folder One</option>
<option value="Folder Two">Folder Two</option>
<option value="Folder Three">Folder Three</option>
<option value="Folder Four">Folder Four</option>
</select>
<select id="names" style="vertical-align: top;" ng-model="master.read">
<option value="Read Only" selected>Read Only</option>
<option value="Read Write">Read + Write</option>
</select>
<input type="button" ng-click="copy();" value="ADD" style="vertical-align: top;">
<br />
<textarea id="output" rows="5" style="vertical-align: top;">
{{user.building}}
{{user.department}}
{{user.folder}}
{{user.read}}
</textarea>
</div>
<script>
function textboxController($scope){
$scope.master={
building: "Building One",
department: "Dept One",
folder: "Folder One",
read: "Read Only"
};
$scope.copy = function(){
$scope.user=angular.copy($scope.master);
};
}
</script>
</body>
</html>
无标题
一号楼
二号楼
三号楼
四号楼
第一部门
二部
第三部门
第四部门
文件夹一
文件夹二
文件夹三
文件夹四
只读
读+写
{{user.building}
{{user.department}
{{user.folder}}
{{user.read}
函数textboxController（$scope）{
$scope.master={
大楼：“一号楼”，
部门：“第一部门”，
文件夹：“文件夹一”，
阅读：“只读”
};
$scope.copy=函数（）{
$scope.user=angular.copy（$scope.master）；
};
}
id=“name”idclass=”“addEventListener（）