UI | 输入 | 媒体 | 导航 | 其他 | 网页模板| APP模板| 常用代码| 在线代码

Simple Switch一个简单的开关

所属分类：输入-选择框

 39814  412  查看评论 (32)
分享到微信朋友圈
X
Simple Switch一个简单的开关 ie兼容9
 查看演示  website  立即下载

使用方法

//本次编写使用jQuery版本为 1.8.3
<script type="text/javascript" src="js/183.js"></script>
//引用核心文件
<script type="text/javascript" src="js/simple.switch.min.js"></script>
<link rel="stylesheet" href="css/simple.switch.three.css" type="text/css">
//压缩后的JS文件不到3K

简单调用方法

<input type="checkbox" class="checkbox" disabled>
<input type="checkbox" class="checkbox" disabled checked>
<input type="checkbox" class="checkbox">
<input type="checkbox" class="checkbox" checked>
<script>
    $(".checkbox").simpleSwitch();
</script>


相关插件-选择框
查看更多

vue2.0实现全选，全不选。

 当单个选中所有时，全选自动变成全选状态；当全选后，取消其中一个，全选状态改变。
  选择框
 33228  361

jQuery下拉框各种选择插件jquery,jquery插件

 下拉框各种选择插件
  选择框
 43171  335

选择联系人效果，搜索单个联系人功能（原创）

 选择添加联系人效果，并带有搜索功能，实现更好人员选择效果jQuery插件
  选择框
 33961  377

js模拟ios联动插件iosselect

 html下拉菜单select在安卓和IOS下表现不一样，iosselect正是为统一下拉菜单样式而生
  选择框
 32328  360

讨论这个项目（32）回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    亡枪 0
    2020/6/16 18:14:34
    楼主，我想请问一下怎么捕获点击事件呢 控制on/off 回复
    When 时过 。 0
    2018/7/9 9:45:41
    不兼容其他版本的jQuery ，差评
        Beau丶0
        2018/7/9 9:58:22
        emmm，我几年前写的。抱歉了
    回复
    ZhouMaoz 0
    2018/3/30 16:38:33
    $("").prop('checked') 回复
    诗诗诗诗李 0
    2018/2/11 14:25:58

    为什么直接初始化了两个开关出来，我只写了一个

    <input type="checkbox" class="powerswitch" checked>
    回复
    ▕,佐佴 0
    2017/12/25 11:53:38
    $("#FoodShow .checkbox").live("click", function () {
       console.log($(this).attr("result"))
});

    为什么我这样写出来，拿到的result值是反的，on是false off是true

    回复
    AIR 0
    2017/10/6 15:40:05

    只能用 jquery 1.83   其他版本不兼容啊

    回复
    为了依 0
    2017/8/9 13:56:10

    必须mark,这个效果太棒了,正是我需要的,手机页面用复选框,感觉展示效果丑爆了,改成这个肯定好看多了,

    回复
    ・ 0
    2017/7/24 14:12:00

    怎么支持js/jquery-1.11.0.min.js这个版本啊

        Beau丶1
        2017/7/24 14:14:06
        <script src="http://www.jq22.com/jquery/jquery-migrate-1.2.1.min.js"></script>
        ・0
        2017/7/24 15:31:12

        请问，他这个文字 能不能在页面上改变 而不是写死在CSS上

    回复
    等心静如你丶丿 0
    2017/4/25 9:46:13

    怎么调整大小？我觉得有点大了

        Beau丶0
        2017/4/25 9:54:20

        API：

        https://1029131145.github.io/Simple-Switch/

        如果要调节大小  得修改样式文件。

        尼古拉斯-赵四0
        2019/3/15 15:21:06
        你好，我想修改下大小，但不怎么会css，调不来啊
    回复
    @Sun了个晒 0
    2017/4/15 14:19:43

    这个可以在ASP.net里用吗?

        areyouOk0
        2017/4/15 14:36:30

        当然可以了，前端代码又不关联你后端用什么语言。

        wangshulan0
        2017/6/13 19:55:01

        怎么切换,

        wangshulan0
        2017/6/13 19:57:27

        怎么切换,如果一开始处于没选中状态,点击的时候怎么变成选中状态,怎么动态加那个checked,

    回复
查看更多评论
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • ⭐
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • ⭐
  • 💖
  • 💔
取消回复