select动态创建option

最新推荐文章于 2022-11-17 14:23:33 发布

huajun_liweizhi

最新推荐文章于 2022-11-17 14:23:33 发布

阅读量181

点赞数

CC 4.0 BY-SA版权

分类专栏： js 文章标签： Ajax json

本文链接：https://blog.youkuaiyun.com/huajun_liweizhi/article/details/83644358

js 专栏收录该内容

67 篇文章

订阅专栏

本文介绍了一种使用AJAX技术实现从服务器获取栏目列表并动态填充到下拉框中的方法。通过发送POST请求调用PartServlet接口，获得JSON格式的数据，并利用这些数据创建并添加选项元素到指定的下拉框中。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

//得到所有栏目的下拉列表
$("#part").click(function(){
           var actions = "/rhcy/PartServlet?flag=part1";
           var param = "";
           $.ajax({

               url:actions,
               data:param,
               type:'POST',
               dataType:'json',
               success:function(data){

                   var part = document.getElementById("part");
                   var list4 = data;
                      while(part.children.length>1)
                       {
                          part.removeChild(part.children[part.children.length-1]);
                       }

                       for(var i =0;i<list4.length;i++){

//前面的是文本，后面的是value，后面的方法可能出错
                           var option = new Option(list4[i].name,list4[i].id)
                            //建议用上面的创建方法，下面的方法会报错
                               // var opts = document.createElement("option");
                               // opts.text = list4[i].name;
                               //opts.value = list4[i].id;
                               part.options.add(option);

                   }

               }

               });
            });