0

我目前正在创建一个订单表格，并且有几个选项，其中我有一个包含 1-8 值的保管箱。对于每个投递箱，我必须使用以下代码

<select name="mydropdownbox">
                <option value=""> 0 </option>
                <option>1</option>
                <option>2</option>
                <option>3</option>
                <option>4</option>
                <option>5</option>
                <option>6</option>
                <option>7</option>
                <option>8</option>
            </select>

每次在表单中添加新项目时，我都必须使用相同的代码。我想知道是否有办法让下拉框都使用相同的值集，这样我的 html 页面中就没有一堆重复代码。

4

1 回答 1

0

它不能只用 HTML 来完成，因为 HTML 不是脚本语言，所以你不能做循环来避免重复。

你有两个选择：

  • 使用生成完整 HTML 的服务器端语言。请注意，这会更占用服务器资源，用户必须下载完整的 HTML 代码
  • 使用 JavaScript。这将需要更多的客户端密集型，并且您将节省带宽。可能的问题是某些用户可能禁用了 JS。

JavaScript 方式很容易使用 HTML5<template>元素实现：

JS：

var content = document.getElementById('dropdown-template').content;
for(var i=0; i<10; ++i) {
    document.body.appendChild(document.importNode(content, true));
}

HTML：

<template id="dropdown-template">
    <select name="mydropdownbox">  <!-- ... -->   </select>
</template>

演示

于 2014-02-12T22:13:00.007 回答