Question

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

label元素的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>

Answer 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..." />

带标签的HTML5验证表单

1 个答案: