Bootstrap 选择选项太多代码答案

【问题标题】：Bootstrap Select options too much codeBootstrap 选择选项太多代码
【发布时间】：2016-12-25 11:26:19
【问题描述】：

我正在使用 Bootstrap 3.3.6 并希望使用选择器来选择某个数量。问题是我希望选项一直到 99，但我注意到代码太重复了，使整个代码有点太多..

现在我有：

<div class="form-group">
   <label for="sel1">select quantity: </label>
   <select class="form-control" id="sel1">
       <option>1</option>
       <option>2</option>
       <option>3</option>
       <option>4</option>
       <option>5</option>
   </select>
</div>

我是否必须写<option></option> 99 次，或者是否有更简单、更快捷的方法来做到这一点？也许与 angularJS？如果是这样，有什么想法吗？

谢谢！

【问题讨论】：

AngularJS ng-options create range的可能重复
抱歉，不知道，因为我不确定 Angular 是一个选项。
没问题。只需将问题标记为重复，然后可以一起找到两个问题

标签： html twitter-bootstrap select

【解决方案1】：

你也可以使用<input type="range"/>：

&lt;input type="number" name="quantity" min="1" max="99" value="22"&gt;

考虑到语义，我认为这个元素比 99 个<option> 项更好。

【讨论】：

【解决方案2】：

你可以使用循环：

var text = 0;
for (i = 0; i <100; i++) { 
    text += "<option>"+[i]+"</option><br />";
}

【讨论】：

【解决方案3】：

如果你可以使用 PHP，你可以这样做：

<div class="form-group">
   <label for="sel1">select quantity: </label>
   <select class="form-control" id="sel1">
     <?php for($i=1; $i <= 99; $i++){ ?>
       <option><?php echo $i; ?></option>
     <?php } ?>
   </select>
</div>

【讨论】：