AJAX动态请求加载后端交互数据,绑定select的方法

       直接上的代码是可以用的,后台代码我就不贴了,我相信后台代码大家都会,直接返回json数据,我是前端比较差的,所以喜欢把每次不会的全部记起来:原理:改变ID请求数据。

html代码

<select id="select" style="width : 80px;height : 30px;">
  //下拉框数据动态加载
</select>

js代码

首先我们必须引入jq插件,

$(function(){
  $.ajax({ 
       url: "xx.php",  //后台webservice里的方法名称 
      contentType: "application/json; charset=utf-8",  
      type: "get", 
      async : true ,
      dataType: "json", 
      success: function (date) { 
        var optionstring = "";
        for (var j = 0; j < date.length;j++) {   
            console.log(data);//控制台查看数据库数据
            console.log(data[j].name);//控制台查看数据库option内容
            console.log(data[j].id);//控制台查看数据库option的ID    
        optionstring += "<option value=\"" + date[j].id + "\" >" +"睡眠次    数:"+date[j].limitnumber+"  睡眠时间:"+date[j].sleeptime + "</option>"; 
        $("#select").html("<option value='0'>请选择...</option> "+optionstring);
              } 
            }, 
            error: function (msg) { 
              alert("出错了!"); 
            } 
      }); 
});

AJAX动态请求加载后端交互数据,绑定select的方法实现,

发布了18 篇原创文章 · 获赞 30 · 访问量 4万+

猜你喜欢

转载自blog.csdn.net/cnpinpai/article/details/105112675