我想在下拉菜单列表中指定数字范围,例如我正在执行的示例中的1-24
<select name="hour">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
...
...
<option value="24">24</option>
</select>
有什么方法我们可以说使用1-24并动态创建下拉菜单,我想我们需要使用Javascript但我不知道如何编码它们?
答案 0 :(得分:15)
您不需要Javascript,可以使用PHP for循环:
<select name="hour">
<?php for ($i = 1; $i <= 24; $i++) : ?>
<option value="<?php echo $i; ?>"><?php echo $i; ?></option>
<?php endfor; ?>
</select>
答案 1 :(得分:3)
您可以使用看起来像这样的javascript来执行此操作:
for(var i=1; i<=24; i++){
var select = document.getElementById("hours");
var option = document.createElement("OPTION");
select.options.add(option);
option.text = i;
option.value = i;
}
以下是我为您制作的完整jsFiddle: jsFiddle
答案 2 :(得分:0)
即使我在你的例子之后也想到了:
<?php
echo "<select>";
for ($h = 1; $h <= 24; $h++) echo "<option value='$h'>$h</option>";
echo "</select>";
?>
答案 3 :(得分:0)
使用PHP Range — Create an array containing a range of elements
echo '<select name="hour">';
foreach (range(1,24) as $number) {
echo '<option value='.$number.'>'.$number.'</option>';
}
echo '</select>';
答案 4 :(得分:0)
此答案现在可能有用。有了HTML5,它变得更加简单。我们不需要javascript来做同样的事情。大多数现代浏览器都支持。无法检查较旧的IE版本。
<label for="hour">Hour:</label>
<input type="number" id="hour" min="1" max="24" />
参考:https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/number