select option动态加载

来源：互联网发布：阿里云服务器搭建免流编辑：程序博客网时间：2024/06/05 17:46

前段时间写的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" onchange="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);        }       }}

阅读全文

0 1