向东博客 专注WEB应用 构架之美 --- 构架之美，在于尽态极妍 | 应用之美，在于药到病除|赢在IT，Playin' with IT,Focus on Killer Application,Marketing Meets Technology.

html为checkBox和radio添加label  
为checkbox或者radio加上label，让对label中文字的点击也同时对checkbox/radio生效：

<input type="checkbox" name="tstCheckBox" id="cbox"><label for="cbox">for checkbox</lable>
<br />
<input type="radio" name="tstradio" id="radio"><label for="radio">for radio</label>
参考：http://blog.longwin.com.tw/2005/04/html_label_radio_bottom/
真正的用PHP的smarty来做是这样的：
---------------------------------------------------------------------------------------------------------------------------------------------------------
<div style="position:relative;width:300px;" id="divadvlist" class="advlist"> <ul style="list-style: none outside none;"> <{foreach from=$album item=value}>     <li style="padding: 3px 0;"><input type="radio" name="albumids[]" value="<{$value->album_id}>" id="<{$value->album_id}>"><label for="<{$value->album_id}>"><{$value->name}></label></li> <{/foreach}> </ul> </div>
---------------------------------------------------------------------------------------------------------------------------------------------------------
Label标识有两个属性，一个是FOR，一个是ACCESSKEY。

FOR的意思是，这个Lable是为哪个控件服务的；
ACCESSKEY则定义了访问这个控件的热键。
比如，有一个名字叫Name的文本框，<INPUT TYPE="TEXT" ID="Name" SIZE=30>，
那么，<label>就可以定义成：<LABEL FOR="Name" ACCESSKEY="N">姓　　名（<U>N</U>）：</LABEL>。
可以看见，这个<Label>是为那个ID为“Name”控件服务的，而ACESSKEY则定义了，这访问这个控件的热键为“Alt+N”。


1<LABEL FOR="txtName" ACCESSKEY="N">姓　　名（<U>N</U>）：</LABEL>
2<INPUT TYPE="TEXT" ID="txtName" SIZE=30>Meil<br>
3
4<LABEL FOR="txtUrl" ACCESSKEY="U">个人主页（<U>U</U>）：</LABEL>
5<INPUT TYPE="TEXT" ID="txtUrl" SIZE=30>http://www.livebaby.cn<br>
6
7<LABEL FOR="txtPhonebox" ACCESSKEY="P">联系电话（<U>P</U>）：</LABEL>
8<INPUT TYPE="TEXT" ID="txtPhonebox" SIZE=30> <br>
9
10<LABEL FOR="areabox" ACCESSKEY="S" >留　　言（<U>S</U>）：</LABEL>
11<TEXTAREA ID="areabox" COLS="30" ROWS="3"></TEXTAREA>


　　单选钮、复选框都要点击控件才能选中控件，而如果使用<label>标识就可以实现点击文字选取。

点击文字可以选取的多项选择框：


1<input type="CHECKBOX" id="chk1" value="often" name="chkoften">
2<label for="chk1" >经常来这里</label>
3<input type="CHECKBOX" id="chk2" value="seldom" name="chkseldom">
4<label for="chk2" >偶尔来看看</label>
带热键的多项选择框：
1<input type="CHECKBOX" id="chk3" value="often" name="chkoften">
2<label for="chk3" ACCESSKEY="H">经常来这里（<U>H</U>）</label>
3<input type="CHECKBOX" id="chk4" value="seldom" name="chkseldom">
4<label for="chk4" ACCESSKEY="L">偶尔来看看（<U>L</U>）</label>


===========================
例如，在 XHTML 中：

显式的联系：
<label for="SSN">Social Security Number:</label>
<input type="text" name="SocSecNum" id="SSn" />

隐式的联系：
<label>Date of Birth: <input type="text" name="DofB" /></label>

作者：jackxiang@向东博客 专注WEB应用 构架之美 --- 构架之美，在于尽态极妍 | 应用之美，在于药到病除
地址：https://jackxiang.com/post/2529/
版权所有。转载时必须以链接形式注明作者和原始出处及本声明！