文章目录

点击表格选中checkbox复选框

今天遇到一个问题,后台管理文章的时候,点击checkbox复选框不是很方便。

为什么不方便呢?

因为我把它放在一个td表格里面,而复选框就那么一点点大,不容易点得准。

点击表格选中checkbox复选框

于是就在想如何才能点击表格,就能选中复选框。

想了一下,终于找到了解决办法。

看下面代码。

html代码<table border="1" style="width:100%;">
  <tr>
     	<td style="width:80%;">标题</td>
     	<td>选择</td>
     </tr>
  <tr>
     	<td>php教程文章</td>
     	<td><label style="display:block;"><input name="select[]" value="1" type="checkbox"></label></td>
     </tr>
  <tr>
     	<td>javascript教程文章</td>
     	<td><label style="display:block;"><input name="select[]" value="2" type="checkbox"></label></td>
     </tr>
  <tr>
     	<td>python教程文章</td>
     	<td><label style="display:block;"><input name="select[]" value="3" type="checkbox"></label></td>
     </tr>
  <tr>
     	<td>jquery教程文章</td>
     	<td><label style="display:block;"><input name="select[]" value="4" type="checkbox"></label></td>
     </tr>
  </table>
亲自测试一下

发现没有,很简单,我们只需使用label标签将checkbox包起来,然后给label标签添加样式display:block即可。

而最后一个没有为label标签加其样式,则只能移到复选框上面才能选中。

本文网址:http://www.santii.com/article/163.html


数据更新时间:2018-09-21