checkbox 实现单选效果(html)

最新推荐文章于 2021-06-04 16:27:59 发布

VIP文章 HiRonan

最新推荐文章于 2021-06-04 16:27:59 发布

阅读量2.8k

点赞数

分类专栏：小功能文章标签： html checkbox 单选效果

本文链接：https://blog.csdn.net/u012360222/article/details/33191693

版权

note：在html <input> 标签类中的checkbox实现单选效果。

在最近的开发项目中，客户要求使用小方格子实现“单选”功能，显然圆点的radio被out了，只能选择chckbox的方块样式，也在网上搜过，可能有点儿脑残，没有找到。

废话不多说直接上代码：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>checkbox实现单选效果</title>
    <script src="jquery-1.7.2.min.js"></script>
    <script>
        $(document).ready(function () {
            $('.sb').click(function () {
                var typeThis = typeof ($(this).attr("checked"));
                switch (typeThis) {
                    case "string":
                        if ($(this).attr("checked").toLowerCase()=="checked") {
                            $('