列表元素“值”属性

我有一个用CSS/Javascript创建的自定义样式下拉选择框，其意图模仿<select>元素。该框是<div>，其内部列表由<li>元素组成，该元素镜像标准选择框的<option>元素。列表元素“值”属性

现在，标准选择<option>元素有两个重要组成部分：内部文本节点（实际显示在屏幕上的下拉列表中）和属性，该属性是指示选择值的字符串用于表单提交或Javascript）。

使用我的自定义框，<li>元素中的文本节点镜像<option>元素中的内部文本节点。但是，我应该如何镜像“值”属性？根据w3schools（不是最好的资源，我知道），LI元素有一个可以使用的“value”属性，但它不赞成使用CSS样式。但是什么CSS属性可以用来表示List元素的“值”？或者是否有更好的方法将一个值与LI元素相关联？

来源

2012-06-20 Channel72

'value'属性用于指示有序列表的项目编号。因此，对于CSS，您将使用生成的内容，而不是在标记中包含数字。它与表单元素上的'value'无关。如果你需要一个很好的参考，你总是可以依赖于实际的规格：http://developers.whatwg.org/grouping-content.html#the-li-element –

开始 “数据 - ” 是有效的HTML时下任何属性。所以你可以做这样的事情：

<ul> 
    <li data-value="1">Option #1</li> 
    <li data-value="754">Option #2</li> 
</ul>

这样你可以很容易地在后面的每个选项访问你的价值。

来源

2012-06-20 13:50:41

您应该使用HTML5 data-*属性你需要存储一个元素上的任意数据的任何时间：

<li data-value="something">Some text</li>

旁注：

的方框是<div>与内部列表由<li>元素组成

我希望你有一个ul（或ol或menu）元素作为这些li元素的父项！

来源

2012-06-20 13:49:54

“但什么CSS属性可以使用”没有CSS属性，因为只有HTML属性。

要存储任何元素上的任何数据，您可以使用data-*属性，例如<li data-value="some value">。

来源

2012-06-20 13:50:01 feeela

根据HTML5非标准你应该使用数据 - *属性

<li data-value="value">Text here</li>

来源

2012-06-20 13:50:05 odiszapc

列表元素“值”属性

回答

相关问题