Javascript下拉菜单动态创建节点

最新推荐文章于 2021-11-09 17:25:02 发布

zhangdongying111111

最新推荐文章于 2021-11-09 17:25:02 发布

阅读量303

点赞数

文章标签： javascript UI 节点 ViewUI

本文链接：https://blog.csdn.net/zhangdongying111111/article/details/84532805

版权

今天突然想做个[b]下拉菜单响应动态创建节点[/b]文本框的js代码，其实并不是太难
很轻松的便做了出来，但是每次下拉菜单内容变换，去都是在body后面添加子文本框，所以声明了一个count变量，用来计数，以下附上html的测试代码


<html>
	<head>
		<title>test js</title>
	</head>
	<body>
	<select name="char" id="test" onchange="abc()">
		<option value="">-choose-</option>
	        <option value="aaa">aaa</option>
		<option value="bbb">bbb</option>
		<option value="ccc">ccc</option>
		<option value="ddd">ddd</option>
	</select>
	<script>
        	var count=0;
		function abc () {
	        	count++;
			var xxx = document.getElementById("test").value;
			if(xxx=="aaa"&&count==1){
				var dhy1 = document.createElement("input");
				dhy1.type="text";
				document.getElementsByTagName("body")[0].appendChild(dhy1);	
			}else if((xxx=="bbb"||xxx=="ccc")&&count==1){
				var dhy2 = document.createElement("input");
				var dhy3 = document.createElement("input");
				dhy2.type="date";					                  dhy3.type="date";
				document.getElementsByTagName("body")[0].appendChild(dhy2)
					document.getElementsByTagName("body")[0].appendChild(dhy3);			
				}else{
					alert("加载完成!");
				}
			}
		</script>
	</body>
</html>