html 单选打勾效果,checkbox 实现单选效果(html)
note:在html 标签类中的checkbox实现单选效果。
在最近的开发项目中,客户要求使用小方格子实现“单选”功能,显然圆点的radio被out了,只能选择chckbox的方块样式,也在网上搜过,可能有点儿脑残,没有找到。
废话不多说直接上代码:
ps:只是一个简单的demo。
checkbox实现单选效果
$(document).ready(function () {
$('.sb').click(function () {
var typeThis = typeof ($(this).attr("checked"));
switch (typeThis) {
case "string":
if ($(this).attr("checked").toLowerCase()=="checked") {
$('.sb').each(function () {
$(this).removeAttr("checked");
});
$(this).attr("checked",true);
}
break;
case "undefined":
$('.sb').each(function () {
$(this).removeAttr("checked");
});
break;
}
});
});
当然在case “undefined” 中的代码可有可无,大家可以试试
element-ui Table表格结合CheckBox实现单选效果
最近做项目遇到一个需求,需要实现一个表格的单选,由于项目使用的是element-ui.于是去看了表格的文档,确实有单选的方法,但是官方的单选是直接选中表格行,通过颜色来区分 看着效果不明显,实际需要一 ...
[原创]纯JS实现网页中多选复选框checkbox和单选radio的美化效果
图片素材: 最终效果图:
纯JS实现网页中多选复选框checkbox和单选radio的美化效果& ...
ViewPagerWithViewDemo【ViewPager和View搭配以及演示获取里面的值和CheckBox单选效果】
版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 简单记录下ViewPager和自定义布局view的搭配使用以及布局文件中单选效果.获取viewpager布局内部值的功能. 效果图 ...
多个互相有联系的checkbox的单选逻辑
checkbox单选的状态逻辑,状态好的时候一下就写好了,状态不好的时候要调试比较久,当然主要是对其中的事件不太清楚. 先给出效果图吧. 然后给出代码, selectZhiFuBaoPay.setOn ...
Android在listview添加checkbox实现单选多选操作问题
android根据View的不同状态更换不同的背景http://www.eoeandroid.com/thread-198029-1-1.html android 模仿朋友网推出的菜单效果[改进版]h ...
GridView控件中Checkbox实现单选
在GridView控件中,第0列有放一个CheckBox控件,现想实现对CheckBox进行单选. 先看看效果: 在ASPX页面,可以这样做: 有一点注意的是需要使用OnRowCreated事件. 在 ...
checkbox设置单选
http://blog.sina.com.cn/s/blog_4550f3ca010137td.html $("*") ‘表示获取所有对象 $("#XXX" ...
ios UIButton设置单选效果,以及同时设置图片和标题
一,设置单选效果 - (void)selectedBtnPress:(UIButton*)sender { //首先把原来按钮的选中效果消除 for (int i=0;i
Android在listview添加checkbox实现单选多选操作问题(转)
转自:http://yangshen998.iteye.com/blog/1310183 在Android某些开发需求当中,有时候需要在listveiw中加入checkbox实现单选,多选操作.表面上 ...
随机推荐
Android数据存储之SharedPreferences及如何安全存储
前言: 最近一直在学习ios的数据存储,当学习到NSUserDefaults的时候让我回想起了SharedPreferences,今天闲来无事,想着总结一下SharedPreferences的使用. ...
LeetCode Add Strings
原题链接在这里:https://leetcode.com/problems/add-strings/ 题目: Given two non-negative numbers num1 and num2 ...
css图片映射
a
[转] ArcEngine中打开各种数据源(WorkSpace)的连接
原文 ArcEngine中打开各种数据源(WorkSpace)的连接(SDE.personal/File.ShapeFile.CAD数据.影像图.影像数据集) ArcEngine 可以接受多种数据源. ...
C#汉字转拼音首字母
输入汉字,提取其首字母: /// /// 汉字转拼音缩写 /// Code By /// 2004-11-30 /// /// < ...
[转]Spring Boot——2分钟构建spring web mvc REST风格HelloWorld
Spring Boot——2分钟构建spring web mvc REST风格HelloWorld http://projects.spring.io/spring-boot/ http://spri ...
Hierarchyid(层次结构)数据类型
实例表结构 CREATE TABLE [dbo].[Emp]( ,), ), [Org] [hierarchyid], ) INSERT INTO Emp(Name,Org) VALUES('吴xx' ...
[python] bluepy 一款python封装的BLE利器
1.bluepy 简介 bluepy 是github上一个很好的蓝牙开源项目,其地址在 LINK-1, 其主要功能是用python实现linux上BLE的接口. This is a project t ...
FatTree拓扑结构
FatTree拓扑结构是由MIT的Fares等人在改进传统树形结构性能的基础上提出的,属于switch-only型拓扑. 整个拓扑网络分为三个层次:自上而下分别为边缘层(edge).汇聚层(aggre ...
html 单选打勾效果,checkbox 实现单选效果(html)相关推荐
- 多个互相有联系的checkbox的单选逻辑
checkbox单选的状态逻辑,状态好的时候一下就写好了,状态不好的时候要调试比较久,当然主要是对其中的事件不太清楚. 先给出效果图吧. 然后给出代码, selectZhiFuBaoPay.setOn ...
- Android在listview添加checkbox实现单选多选操作问题
android根据View的不同状态更换不同的背景 http://www.eoeandroid.com/thread-198029-1-1.html android 模仿朋友网推出的菜单效果[改进版] ...
- jquery checkbox 实现单选
最近在用javascript的时候发现网上实现checkbox单选的代码都已经过时了. 用着几年前的代码发现根本不行了 原因是jquery api已经更改 http://api.jquery.com/ ...
- WEB自动化_告警框处理(对话框、确认框、提示框、输入/编辑框、勾选框、单选框、复选框、下拉框)
WEB自动化_下拉框选择(通过元素的value属性选择.下标选择.文本选择) 1. 获取(对话框.确认框.提示框)对象 al = driver.switch_to.alert点击ok 获取文本 点击c ...
- ElementUI:Checkbox实现单选,嵌套多选
官网地址:ElementUI-Checkbox 一.Checkbox 基础介绍 <template><!-- `checked` 为 true 或 false --><e ...
- 复选框(checkbox)、单选框(radiobox)的使用
复选框(checkbox).单选框(radiobox)的使用 复选框: HTML: // 复选框 <input type="checkbox" name="chec ...
- ListView 自己定义BaseAdapter实现单选打勾(无漏洞)
ListView 自己定义BaseAdapter实现单选打勾(无漏洞) (假设须要完整demo,请评论留下邮箱) (眼下源代码已经不发送.假设须要源代码,加qq316701116.不喜勿扰) 近期由于 ...
- html 勾选框点击文字勾选,ztree点击文字勾选checkbox,radio实现方法
ztree的复选框checkbok,单选框radio是用背景图片来模拟的,所以点击文字即使用label括起checkbox,radio文字一起,点击文字也是无法勾选checkbox. 要想点击ztre ...
- layui table行点击tr_layui的table单击行勾选checkbox功能方法
如下所示: //单击行勾选checkbox事件 $(document).on("click",".layui-table-body table.layui-table t ...
最新文章
- 天合汽车安全技术(张家港)有限公司
- 2019-11-13 有趣的网站(持续更新)
- 【TensorFlow-windows】学习笔记八——简化网络书写
- Spring系列(十三):AOP相关知识笔记
- 【ArcGIS微课1000例】0013:ArcGIS创建色带图例(以GlobeLand30土地覆盖数据为例)
- JAVA面试常考系列九
- OFDM技术及其应用
- Vue基础之表单控件绑定
- Linux系统管理(5)——使用yum快速搭建LAMP环境【方便快捷版】
- 30.TCP/IP 详解卷1 --- 其他的 TCP/IP 应用程序
- solr面试题_查看您的Solr缓存大小:Eclipse Memory Analyzer
- Netty创建upd服务端
- Android开发之连接夜神模拟器
- JQuery监听页面滚动总结
- 【绝知此事要躬行】线性表之链表OJ(上)
- python二项分布产生随机数_python随机生成 - osc_c10h48oh的个人空间 - OSCHINA - 中文开源技术交流社区...
- “create-react-app myapp 创建失败”的总结
- 01-Weakly supervised consistency
- 装箱问题c语言函数,C语言基于贪心算法解决装箱问题的方法
- mysql盲注脱裤_BT5下使用SQLMAP入侵加脱裤 -电脑资料