多个HTML5选择共享一个列表

时间:2017-11-25 22:33:26

标签: javascript html

假设我在表单中有10个字段,所有字段都需要是从1950年到2017年的选择。是否可以创建1950年至2017年的一个列表并让每个选项参考那份清单?或者我是否必须为每个选择创建10个相同的列表。

编辑:一个明显的应用程序将是所有家庭成员的生日? (不需要多个相同的选择非常明显吗?)

编辑2:我认为会有类似于如何编写一个数据列表并且有大量输入引用该数据列表的功能。这不是一个合理的问题吗?洛尔

1 个答案:

答案 0 :(得分:0)

有很多方法可以在多个元素上重复使用相同的列表,或创建自定义组件,但与仅复制元素或其HTML相比,它们都过于复杂:

// add 1 clone with different attribute
var sel2 = sel1.cloneNode(true)
sel2.id = 'sel2'
sel1.parentNode.appendChild(sel2)  // or sel.insertAdjacentElement('afterend', sel2)

// insert 9 clones, but with the same atributes 
sel1.outerHTML += Array(10).join(sel1.outerHTML)
<select id=sel1>
  <option>1</option>
  <option>2</option>
</select>