当前位置: 代码迷 >> Web前端 >> jquery动态增多输入框
  详细解决方案

jquery动态增多输入框

热度:335   发布时间:2012-10-08 19:54:56.0
jquery动态增加输入框
<script type="text/javascript">	
	function selectCount(){		
		var aa = $(".mm input").length;		
		if(aa!=0){
			var rss = "";
			for(var j=0;j<aa; j++){												
				rss += document.getElementById("names"+[j]).value +",";
				}
				//alert(rss);
				var ress = rss.split(",");			
				clearSelect();	
				var Str = "";	
				var count = 0;
				var num = $("#num").val();  //下拉中的数字																				
				for(var i=0; i<num; i++){
					var $input = document.createElement("input");															
					$input.type = 'text';
					$input.name = "names"+count;
					$input.id = "names"+count;	
					//$input.className = 'text';																									
					$("#ret").append("选项名称:").append($input).append("</br>");						
					for(var k=0;k<=ress.length; k++){																																			
						$("#names"+k).attr("value",ress[k]);													
					}						
					Str += $input.id +",";
					count++;							
				}									 							
			}		
		else{
			clearSelect();	
			var Str = "";	
			var count = 0;
			var num = $("#num").val();  //下拉中的数字																											
			for(var i=0; i<num; i++){
				var $input = document.createElement("input");			
				$input.type = 'text';
				$input.name = "names"+count;
				$input.id = "names"+count;
				//$input.className = 'text';													
				$("#ret").append("选项名称:").append($input).append("</br>");
				count++;
				Str += $input.id +",";									
			}
			}
																			
		}
	function clearSelect(){		
		$("#ret").html("");			
		}					 
	</script>

<body>
<select id="num" name="num" onchange ="selectCount();">
	<option value="1">1</option>
		<option value="2">2</option>
				<option value="3">3</option>
						<option value="4">4</option>
</select>
<div id="ret" class="mm" align="center"></div>
</body>
  相关解决方案