懒洋洋大人 2015-05-26 14:36 采纳率: 75%
浏览 4951
已采纳

在html中，多个li怎么控制选择样式，多选。或者怎么实现自定义的checkbox。有布局的页面。

图片说明
如图，一个图片对应的是一行或者两行文字，这个怎么布局比较好呢？我目前是用的li。如果用li怎么实现多选呢？求解求思路。谢谢。

  • 写回答

2条回答 默认 最新

  • danielinbiti 2015-05-26 15:02
    关注

    用什么都可以，可以用样式变化模拟选中，如果要有前面的框，那就自己加背景图，设置要样式里

     <html> 
<head> 
    <script src="http://lib.sinaapp.com/js/jquery/1.8.3/jquery.min.js"></script>
    <style>
        ul li{
             list-style-type:none;
        }
        .on{
            background-color:red;
        }
        .off{
            background-color:none;
        }
    </style>
</head> 
<script>

</script>
<body> 
    <ul id="meslib">
         <li>1111111</li>
         <li>2222</li>
         <li>3333</li>
         <li>444444444</li>
    </ul>
<input type='button' value='获取选中的li' onclick="getSelect()"></input>
<script>
    function getSelect(){
         alert($('.on').length);
    }
  $('li').click(function(){
     $(this).toggleClass('on');
  });
</script>
</body> 
</html>
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题？

悬赏问题

  • ¥15 stm32流水灯＋呼吸灯＋外部中断按键
  • ¥15 将二维数组，按照假设的规定，如0/1/0 == "4"，把对应列位置写成一个字符并打印输出该字符
  • ¥15 NX MCD仿真与博途通讯不了啥情况
  • ¥15 win11家庭中文版安装docker遇到Hyper-V启用失败解决办法整理
  • ¥15 gradio的web端页面格式不对的问题
  • ¥15 求大家看看Nonce如何配置
  • ¥15 Matlab怎么求解含参的二重积分？
  • ¥15 苹果手机突然连不上wifi了？
  • ¥15 cgictest.cgi文件无法访问
  • ¥20 删除和修改功能无法调用