從下拉數據

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); 
    }); 
}, 

問候來自墨西哥，抱歉我的英語不好。