select option动态加载

前段时间写的combobox，当时以为select option内容只能是写死的，没想到自己的姿势水平还是需要提高啊。。

combobox实在是太难看了，自己还不会调样式，试试select option吧。

        $.ajax({
			url:"order/findAllZw",
			data:{},
			dataType:"json",
			type:"post",
			success:function(result){
				//console.log(result);
				   var zhangwu=document.getElementById('zhangwu');//根据id查询对象
				   data=eval('result');
				   for(var i=0;i<data.length;i++){
				      zhangwu.options.add(new Option(data[i].username,data[i].id)); //obj.options.add(new Option("text","value"));
				   }		
			},
			error:function(result){
			    alert("加载账务失败");
			}
		});

	@RequestMapping("findAllZw")  
	@ResponseBody    
	public void findAllZw(HttpServletRequest req,HttpServletResponse res) throws Exception{  
		JSONArray jsonArray=new JSONArray() ;   
	   List<Map<String, String>> lists=new ArrayList<Map<String, String>>();  
	   lists=orderService.findAllZw();  
	   //System.out.println(lists);  
	   jsonArray =JSONArray.fromObject(lists);  
	    res.setContentType("text/html;charset=utf-8");  
	    PrintWriter pw = res.getWriter();  
	    pw.write(jsonArray.toString());  
	    pw.flush();  
	  // return new JsonResult(0);
	} 

获取选中的value:

$("#gfmc").val();

获取选中的text:

$("#SelectId").find("option:selected").text();

当select option里的内容发生变化时，导致其他内容也发生变化:

                    <div class="tianjia22">
                          <div class="tianjia18">单位名称：</div>
                          <div class="tianjia19">
                          <select type="text" name="gfmc" id="gfmc" οnchange="demo(this.options[this.options.selectedIndex].value);" class="tianjia20" placeholder="xxx" readonly="true"/>
                           
                          </select></div>
                    </div><!--tianjia22 end-->

添加了一个onchange事件：

	function demo(a){
	//	var d=document.getElementById("gfmc");
	//	console.log($("#gfmc").val());
	//	console.log(d.val());
		console.log(a);
		$("#gfmc option[value='"+a+"']").attr("selected", true);
	    for(var i=0;i<data.length;i++){ 
	        if(a==data[i].id){
	        	$("#gfsh").val(data[i].khshuihao);
	        	$("#gfdzdh").val(data[i].khdzdh);
	        	$("#gfyhzh").val(data[i].khyhzh);
	        }
	       }
		
	}

清空select option中全部选项:

id选择器:

$("#"+roleId+"").empty();

原生：

                var role_id=document.getElementById(roleId);//根据id查询对象
                role_id.options.length=0;