js循环表单添加下拉列表,重复添值,并且可编辑,追填

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_24521431/article/details/83386330
	var td2=$("<td><input name='details["+index+"].month' value='"+month+"' type='hidden'><input name='details["+index+"].week' value='"+week+"' type='hidden'>第"+monthSwitch(week)+"周</td>");
	var td3=$("<td><input name='details["+index+"].training_content' type='text'></td>");
	var td4=$("<td><input name='details["+index+"].join_person' type='text'>" +
			"<select type='text' class='list-select' id='list-select["+index+"]' 

//部分代码,传进来一个index,(0,1,2,3),通过index循环添加表格,首先在select加一个onchange事件

onchange='select_text("+index+");'>" +
			 "<option value=''></option>" +
	  "<option value='全体护理人员'>全体护理人员</option>" +
      "<option value='实习护士'>实习护士</option>" +
      "<option value='新聘护士'>新聘护士</option>" +
      "<option value='一年资护士'>一年资护士</option>" +
      "<option value='二年资护士'>二年资护士</option>" +
      "<option value='三年资护士'>三年资护士</option>" +
      "<option value='四年资护士'>四年资护士</option>" +
      "<option value='四年资以上护士'>四年资以上护士</option>" +
      "</select></td>");

效果是上图这样,需求是在参加人员这添加一个下拉列表,可以选多次值,还可以手动添加值,我是在下拉列表上放了一个input,每次select选值可以通过数组添加到input,还可以手动输入,直接上代码,新手写的一般,大神勿喷,

var jperson = new Array();
var maths = new Array();
function select_text(indexs){
	maths.push(indexs);
	//首先获得下拉框的节点对象
  var select = document.getElementById("list-select["+indexs+"]");
  //如何获得该下拉框所有的option的节点对象
	    var options = select.options;
	 //获得当前选中的option的索引
	    var index = select.selectedIndex;
	   //获取索引对应的select值
	    var selectedText = options[index].text;
	    var result= $.inArray(selectedText, jperson); 
	    //判断添加的是否为同一行,是的话继续
	if((maths[0]==indexs)==true){
		 //判断值是否已经存在,并且值不为空
		 if(result==-1 && selectedText!=null && selectedText!=""){
			    jperson.push(selectedText);
			    //向input中继续添加值
			      $("input[name='details["+indexs+"].join_person']").attr('value',jperson); 
			      //如果值存在result!=-1时
			    }else if(selectedText!=null && selectedText!="" ){
			    	//删除数组中存在的值
			    	jperson.splice(result,1);
			    //清空input内容
			    	  $("input[name='details["+indexs+"].join_person']").attr("value","");
			    //添加剩余数组
			    	 $("input[name='details["+indexs+"].join_person']").attr('value',jperson); 
			    }else{
			    	//
			    	jperson.splice(0,jperson.length);  
			    	 $("input[name='details["+indexs+"].join_person']").attr('value',jperson); 
			    }
	}else{
		 //添加的不是同一行的内容,清空数组,添加新内容到数组
		jperson.splice(0,jperson.length); 
		 jperson.push(selectedText);
		 //添加到input
		 $("input[name='details["+indexs+"].join_person']").attr('value',jperson); 
		 maths.splice(0,maths.length);  
	}
}

猜你喜欢

转载自blog.csdn.net/qq_24521431/article/details/83386330
今日推荐