简单的方法添加下拉菜单1 - 100而不做100个不同的选项?

Gib*_*nFX 21 html forms

我只是想知道是否有一个简单的快捷方式可以在1到100的数字下拉菜单中添加选项,而不必执行以下操作:

<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
Run Code Online (Sandbox Code Playgroud)

等一直到100?

谢谢

Cur*_*urt 27

我不敢用简单的HTML.

你可以使用一些jQuery来做到这一点:

$(function(){
    var $select = $(".1-100");
    for (i=1;i<=100;i++){
        $select.append($('<option></option>').val(i).html(i))
    }
});?
Run Code Online (Sandbox Code Playgroud)

- 看见演示 -

你可以在这里下载jQuery


tot*_*rds 16

据我所知,不是纯HTML.

但是使用JS或PHP或其他脚本语言(如JSP),您可以使用for循环轻松完成.

PHP中的示例:

<select>
<?php
    for ($i=1; $i<=100; $i++)
    {
        ?>
            <option value="<?php echo $i;?>"><?php echo $i;?></option>
        <?php
    }
?>
</select>
Run Code Online (Sandbox Code Playgroud)


Dar*_*jax 9

除了html,你使用的是JavaScript还是jQuery?如果你是,你可以这样做:

HTML:

<select id='some_selector'></select>?
Run Code Online (Sandbox Code Playgroud)

jQuery的:

var select = '';
for (i=1;i<=100;i++){
    select += '<option val=' + i + '>' + i + '</option>';
}
$('#some_selector').html(select);
Run Code Online (Sandbox Code Playgroud)

正如你在这里看到的那样.

兼容浏览器而不是select的另一个选项,你可以使用的是HTML5 input type=number:

<input type="number" min="1" max="100" value="1">
Run Code Online (Sandbox Code Playgroud)


jer*_*mjt 7

在 Html5 中,您现在可以使用

<form>
<input type="number" min="1" max="100">
</form>
Run Code Online (Sandbox Code Playgroud)