从下拉数据

Question

我有2分的情况下

1.need的jQuery在页面加载来填充下拉菜单，并产生从下拉菜单中的数据动态按钮生成动态按钮.. 2.当点击该按钮，在该特定项目下拉菜单应该会出现..

我尝试这样做：

$(document).ready(function() { 
    $.ajax({ 
     type: "POST", 
     contentType: "application/json; charset=utf-8", 
     url: "ClassTouch.aspx/BindDatatoDropdown", 
     data: "{}", 
     dataType: "json", 
     success: function (data) { 
      $.each(data.d, function (key, value) { 
       $("#ddlCountry").append($("<option></option>").val(value.CountryId).html(value.CountryName)); 
      }); 
     }, 
     error: function (result) { 
      alert("Error"); 
     } 
    }); 


    $("#ddlCountry option").each(function() { 
     var r= $('<input class="btns" type="button" value="'+$(this).text()+'"/> '); 
      $("#btn_list").append(r); 
    }); 

     $(".btns").click(function(){ 
      $("#ddlLecturer").val($(this).val()); 
     }); 
    }); 

只有下拉列表填充正常。但按钮不生成..我错过了什么？

Answer 1

我不明白按钮是否生成，但如果它不起作用，类“.btns”的click事件是因为jQuery不直接在动态创建的元素上工作。

试试这个：

$("input").on('click', '.btns', function(){ 
    $("#ddlLecturer").val($(this).val()); 
}); 

如果没有创建按钮，删除此：

$("#ddlCountry option").each(function() { 
    var r= $('<input class="btns" type="button" value="'+$(this).text()+'"/> '); 
     $("#btn_list").append(r); 
}); 

并将其移动到Ajax调用修改此：

success: function (data) { 
    $.each(data.d, function (key, value) { 
     $("#ddlCountry").append($("<option></option>").val(value.CountryId).html(value.CountryName)); 
     var r= '<input class="btns" type="button" value="'+value.CountryName+'"/>'; 
     $("#btn_list").append(r); 
    }); 
}, 

问候来自墨西哥，抱歉我的英语不好。