【问题标题】:HTML5 validation form with labels带有标签的 HTML5 验证表单
【发布时间】:2013-06-26 06:49:16
【问题描述】:

我有一个简单的 HTML5 表单。但是当我做一个代码验证器(http://validator.w3.org/check)时,我得到了多个错误

标签元素的for属性必须引用表单控件。这个错误是什么意思?它指向这条线

 <label id="name0" for="Name" style="width: 180px;">Name</label>

这是我目前的表格

<div id="contact-add" title="Add New Contact" style="display: none;">

        <div id="response-add"></div>
       <form method="post" id="add-form">

       <div class="label-input">
           <label id="name0" for="Name" style="width: 180px;">Name</label>
           <input type="text" id="fullname0" value="" name="name" placeholder="Enter full name..." />
           <input type="hidden" name="add_account_id" id="add_account_id" value="<?php echo $add_account_id; ?>" />

       </div>

       <div class="label-input">
           <label id="title0" for="title" style="width: 180px;">Title (Optional)</label>
           <input type="text" value="" name="title" placeholder="Enter title here..." />
       </div>      

       <div class="label-input">
           <label id="email0" for="email" style="width: 180px;">Email (Optional)</label>
           <input type="text" value="" id="email" name="email" placeholder="Enter email address..." />
       </div>


       <div class="label-input">
           <label id="phone0" for="phone" style="width: 180px;">Direct Number (Optional)</label>
           <input type="text" value="" id="phone_number" name="phone_number" placeholder="Enter direct number..." />
       </div>          
       <div class="label-input">
           <label id="extention0" for="extention" style="width: 180px;">Extention (Optional)</label>
           <input type="text" value="" id="phone_ext" name="phone_ext" placeholder="Enter extention number..." />
       </div>   

       <div class="label-input">
           <label id="shift0" for="shift" style="width: 180px;">Work Shift</label>
           <?php echo generateWorkShiftMenu($db, 'work_shift', 'Day'); ?>
       </div>   


       </form>
</div>

【问题讨论】:

标签: html


【解决方案1】:

标签的for 属性必须是表单控件的ID。即

<label id="name0" for="fullname0" style="width: 180px;">Name</label>
<input type="text" id="fullname0" value="" name="name" placeholder="Enter full name..." />

【讨论】:

  • 谢谢。这就是问题所在。
猜你喜欢
  • 1970-01-01
  • 2019-02-10
  • 1970-01-01
  • 2018-07-04
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2012-07-20
相关资源
最近更新 更多