加载带有数字 1 - 20 的 asp 下拉列表

Question

我有一个名为 ASP 的下拉列表，我需要加载数字 1 到 20，默认选择 1。如何用javascript做到这一点？我有一个示例代码，但下拉列表未加载。我错过了什么吗？

<script>
    function quantitydropdown() {
        var ddl = document.getElementById('quantitydropdownid').getElementsByTagName("select")[0];

        for (var i = 1; i <= 100; i++) {
            var theOption = new Option;
            theOption.text = i;
            theOption.value = i;
            ddl.options[i] = theOption;
        }
    }
</script>

<select id="quantitydropdownid" onchange="javascript:quantitydropdown();" runat="server" style="width: 200px;"></select>

Answer 1

所以，当文档准备好时，我们填充下拉列表：

// Set up event handler for when document is ready
window.addEventListener("DOMContentLoaded", function(){

  // Get reference to drop down
  var ddl = document.getElementById('quantitydropdownid');

  for (var i = 1; i < 21; i++) {
    var theOption = document.createElement("option");
    theOption.text = i;
    theOption.value = i;
    // If it is the first option, make it be selected
    i === 1 ? theOption.selected = "selected" :  "";
    ddl.options[i] = theOption;
  }
});

#quantitydropdownid { width:200px; }

<select id="quantitydropdownid" runat="server"></select>

Answer 2

Please try with this code
-----------------------------------------

JS Code
----------------

$(document).ready(function(){
   quantitydropdown();
})

function quantitydropdown()
{
  for (var i = 1; i <= 20; i++) 
  {
    $("#quantitydropdownid").append( $("<option></option>")
                                    .attr("value", i)
                                    .text(i)
                                   );
   }
}

Css Code
-----------

#quantitydropdownid { width:200px; }

HTML Code
-----------

<select id="quantitydropdownid" runat="server"></select>