个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
26
4
我目前正在构建一个网络表单，我需要用户输入他们的 DOB。
我目前使用了 3 个选择框。一为日，一为月，一为年。
我将它们包裹在“出生日期”标签中，并使用 CSS 对其进行了样式设置。
一切看起来都不错，但是当我去验证时，我收到以下错误:
"label 元素最多可以包含一个 input、button、select、textarea 或 keygen 后代"
很高兴听到是否有更好的方法或任何语义替代方法？
提前致谢:o)
ps - 我也必须在标签中包含一个 br，这是为了让选择框清除标签文本。我已经将选择框包裹在我的标签标签中以用于定位，因为我的表单由两列布局组成。 br 所在的位置似乎没有验证问题。所以希望没事...
以下是 atm 的样子:
这是我的代码自动取款机:
<label id="date_of_birth">Date of Birth:<br />
<select class="first" name="date_of_birth:day" tabindex="7">
<option value="">
<!-- -->
</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>
<select name="date_of_birth:mon" tabindex="8">
<option value="">
<!-- -->
</option>
<option value="1">Jan</option>
<option value="2">Feb</option>
<option value="3">Mar</option>
<option value="4">Apr</option>
<option value="5">May</option>
<option value="6">Jun</option>
<option value="7">Jul</option>
<option value="8">Aug</option>
<option value="9">Sep</option>
<option value="10">Oct</option>
<option value="11">Nov</option>
<option value="12">Dec</option>
</select>
<select name="date_of_birth:year" tabindex="9">
<option value="">
<!-- -->
</option>
<option value="1920">1920</option>
<option value="1921">1921</option>
<option value="1922">1922</option>
<option value="1923">1923</option>
<option value="1924">1924</option>
<option value="1925">1925</option>
<option value="1926">1926</option>
<option value="1927">1927</option>
<option value="1928">1928</option>
<option value="1929">1929</option>
<option value="1930">1930</option>
<option value="1931">1931</option>
<option value="1932">1932</option>
<option value="1933">1933</option>
<option value="1934">1934</option>
<option value="1935">1935</option>
<option value="1936">1936</option>
<option value="1937">1937</option>
<option value="1938">1938</option>
<option value="1939">1939</option>
<option value="1940">1940</option>
<option value="1941">1941</option>
<option value="1942">1942</option>
<option value="1943">1943</option>
<option value="1944">1944</option>
<option value="1945">1945</option>
<option value="1946">1946</option>
<option value="1947">1947</option>
<option value="1948">1948</option>
<option value="1949">1949</option>
<option value="1950">1950</option>
<option value="1951">1951</option>
<option value="1952">1952</option>
<option value="1953">1953</option>
<option value="1954">1954</option>
<option value="1955">1955</option>
<option value="1956">1956</option>
<option value="1957">1957</option>
<option value="1958">1958</option>
<option value="1959">1959</option>
<option value="1960">1960</option>
<option value="1961">1961</option>
<option value="1962">1962</option>
<option value="1963">1963</option>
<option value="1964">1964</option>
<option value="1965">1965</option>
<option value="1966">1966</option>
<option value="1967">1967</option>
<option value="1968">1968</option>
<option value="1969">1969</option>
<option value="1970">1970</option>
<option value="1971">1971</option>
<option value="1972">1972</option>
<option value="1973">1973</option>
<option value="1974">1974</option>
<option value="1975">1975</option>
<option value="1976">1976</option>
<option value="1977">1977</option>
<option value="1978">1978</option>
<option value="1979">1979</option>
<option value="1980">1980</option>
<option value="1981">1981</option>
<option value="1982">1982</option>
<option value="1983">1983</option>
<option value="1984">1984</option>
<option value="1985">1985</option>
<option value="1986">1986</option>
<option value="1987">1987</option>
<option value="1988">1988</option>
<option value="1989">1989</option>
<option value="1990">1990</option>
<option value="1991">1991</option>
<option value="1992">1992</option>
<option value="1993">1993</option>
<option value="1994">1994</option>
<option value="1995">1995</option>
<option value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
</select>
</label>
最佳答案
有建议here为可能有助于回答您的问题的辅助技术适当构建 DOB(在您的情况下， <input> 将替换为 <select> :
This is how I'd tend to do it (I'm not saying it's necessarily the best way, mind you): I have visible text for sighted users, and have css-positioned text offscreen for screen reader users where it will be picked up and correctly associated with the appropriate controls.
Birthdate:
<fieldset id="birthdate">
<label for="birthday_day" class="offset">Birthday Day</label>
<input type="text" name="birthday_day" id="birthday_day" size="2" maxlength="2" value="" />
<label for="birthday_month" class="offset">Birthday Month</label>
<input type="text" name="birthday_month" id="birthday_month" size="2" maxlength="2" value="" />
<label for="birthday_year" class="offset">Birthday Year</label>
<input type="text" name="birthday_year" id="birthday_year" size="4" maxlength="4" value="" />
</fieldset>
...you need a label for each control, otherwise assistive technology will struggle with it - it will just say "edit:" and someone won't necessarily know what they are supposed to put in each field. This method tells the assistive technology without taking up screen real estate.
关于forms - 是否有使用 3 个选择框来选择 'Date of Birth' 的语义方式？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/7574678/
26
4
0
数据框有一个字符串类型的日期列 '2017-01-01' 它被转换为 DateType() df = df.withColumn('date', col('date_string').cast(Dat
这个问题在这里已经有了答案: What is "x && foo()"? (5 个答案) 关闭 8 年前。 我在 bootstrap-datepicker.js 文件中遇到过这个。 作者在_setD
我有一个数据库 utc 字符串，我正在传递到 Date(attrs.endDate)，然后通过 new Date() 减去当前的 utc 日期，但我无法得到它来为我提供 2 个 utc 日期的正确差异
这个问题在这里已经有了答案: how to determine if 2 dates object equals each other? [duplicate] (3 个答案) 关闭 6 年前。 我
这个问题已经有答案了: How can I convert "/Date(1399739515000)/" into date format in JavaScript? (3 个回答) 已关闭 8
根据MDN ，我们只能将以下类型的参数传递给 Date 构造函数: new Date(); new Date(value); // Unix timestamp new Date(dateString
我从表中获取所有项目: endDate >= 现在 endDate 为 NULL published 等于 1。 这是我所拥有的，但它给了我 0 个项目: $items = Items::orderB
此查询需要很长时间才能完成。当我将 WHERE 子句设置为 new_dl >= '2014-01-01' 时，查询大约需要 6 分钟才能浏览大约 3 个月的数据。现在不知道为什么这个应该从 12 个月
我有一个正在为项目开发的小型 Java 程序，它使用 JavaMail 从指定的 URI 中提取用户的收件箱，然后开始处理消息。 在 Outlook 中，属性菜单中有一个功能可以设置邮件的到期日期，它
我想在获取 Date.getHours()、Date.getMinutes() 和 Date.getSeconds() 的值后格式化输出>. 这是一条漫长的路: var dt = new Date()
我发现java.text.DateFormat有两种格式化日期的方法。一种是采用 Date 参数，另一种是采用 Object 参数。我检查了DateFormat源代码，似乎他们调用了不同的内部方法。
我有两个对象，p4 和 p5，它们都具有 Date 属性。在某些时候，构造函数工作正常: p4.setClickDate(new Date(System.currentTimeMillis() - 8
我是使用 Sequelize 和 Node.js 的新手，但我的代码中存在日期比较问题。 User.findOne({ where: { resetToken: passwordToken,
我正在使用一个名为 fullcalendar 的 jquery 日历。当用户单击某一天时，他们将被发送到另一个页面以创建该天的事件。单击的日期作为 date 提供。然后通过下面的函数运行将其转换为 U
我有一个列表列表，每个列表中都有整数值，代表 8 年期间的日期。 dates = [[2014, 11, 14], [2014, 11, 13], ....., [2013, 12, 01]
我有两个表: 首先是TimeValues(示例) time | value 12/28/18 | 5.6 01/03/19 | 5.6 01/04/19 | 5.6 01/09/19 | 5.
关闭。这个问题需要debugging details .它目前不接受答案。 编辑问题以包含 desired behavior, a specific problem or error, and th
像这样实例化的日期对象: new Date("2011-12-13") 返回一个认为自己是星期一的日期对象: Date {Mon Dec 12 2011 16:00:00 GMT-0800 (PST)
我需要选择入住日期和退房日期在指定日期范围之间的房价。这些费率根据其条件单独命名。房费取决于所选日期。这是我的代码: rate_eb rate_name rate_starts rat
我有 [Int64:[String:String]] 其中 Int64 是时间戳。如何检测和删除 [String:String] 中的参数之一是 ["name"] = "test" 并重复多次的同一天
我是一名优秀的程序员,十分优秀！