div模拟radio和checkbox

所属分类:输入-选择框

 27110  290  查看评论 (4)
分享到微信朋友圈
X
div模拟radio和checkbox ie兼容8

使用方法

html 

type : radio /checkbox 必须

<div class="sf-checked" type="radio">
    <div class="sf-checked-item" value='1' checked="checked">启动</div>
    <div class="sf-checked-item" value='2'>禁用</div>
</div>

 js

以html 初始化 

 $(el).sfcheckbox(options);

以数据初始化   'initVal' 方法名 list 初始化数据  

list[{
    text:'text',  //文本内容
    val:'val',    //value值
    state:'state', //选中状态
}]
$(el).sfcheckbox('initVal',list);

获取选中的值

return  //redio 返回val    

checkbox返回 list[{val:'val',text:'text'}....]

 $(el).sfcheckbox('getVal');

赋值

val  需要选中的item项的value值  //redio 只会选中一个    checkbox选中多个

 $(el).sfcheckbox('setVal',val);
相关插件-选择框

jQuery自定义下拉框插件dropdown.js

jquery.down.js用于替代原生,可自定义down的样式,支持键盘事件
  选择框
 30146  309

vue选择检索国家页面模板(原创)

vue.js基于json异步调用可选择并且可以通过国家名称和手机区号进行检索相应的国家,并且有中文、日语、英语、越南语、韩语、五种语言,这些语言的显示是根据游览器语言而定。代码比较容易理解,用起来很方便。(支持多语言自适应手机和网站)
  选择框
 23062  271

jQuery联动下拉菜单

一款简单实用的联动下拉菜单,第一的条件未选择的情况下无法选择第二个,以此类推
  选择框
 42244  347

最新版自制小清新selsct插件

美化下拉插件,兼容至IE8
  选择框
 28771  340

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

    2016奋斗 0
    2019/12/4 17:28:09
    不错的。。。。 回复
    夜秋白 0
    2019/8/15 15:00:31
    我是来学习的, 回复
    谈笑一梦 0
    2019/7/17 18:03:59
    请问只做展示用,不可用disabled,怎么设置的?
        鹤舞白沙1
        2019/7/17 18:43:02

        插件没有提供disabled这个方法,但添加也是很简单的,增加一个禁用标识例如加个name值,

        <div class="sf-checked-item" value='1' checked="checked" name="no">启动</div>

        在cr.js中第161行加入判断

        if($(this).attr("name")=="no"){
             return;
        }

        剩下的自己加个变灰的样式就行了。

    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复