复选框

选中和取消复选框时的背景颜色显示

穿精又带淫゛_ 提交于 2019-12-02 15:32:28
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="Js/jquery.js"></script> <style> table,tr,thead{ border: 2px solid #000; border-collapse: collapse; width: 200px; height: 20px; background-color: cornflowerblue; } .odd{ background-color: antiquewhite; } .even{ background-color: aquamarine; } .checked{ background-color: yellow; </style> </head> <body> <table > <thead> <tr><td></td><td>姓名</td><td>薪水</td><td>年龄</td></tr> </thead> <tr ><td><input type="checkbox"/></td><td>张三</td><td>20000</td><td>23</td></tr> <tr ><td><input type=

layui 数据表格+分页+搜索+checkbox+缓存选中项数据

安稳与你 提交于 2019-12-02 15:04:09
在做数据表格的时候遇到了很多坑, 今天整理一下方便以后使用.   主要功能是使用数据表格, 做分页,做搜索, 还有checkbox, 支持全选.   当选中一些数据的时候, 数据切换页面数据在切换回来后,选中状态就消失了, 我们希望切换回来的时候, 选中状态还能存在, 因此做了个缓存, 使checkbox 保持选中状态.代码如下: 1.HTML 搜索输入框 <form class="layui-form"> <div class="layui-input-inline"> <input type="tel" name="searContent" autocomplete="off" placeholder="姓名/手机/身份证" class="layui-input"> </div> </form> 2.HTML 搜索按钮 <div class="layui-input-inline " style="width: 90px"> <button class="layui-btn" id="searchEmailCompany" data-type="reload"> <i class="layui-icon" style="font-size: 20px; "></i> 搜索 </button> </div> 3.HTML table表格 <div class="yys

jQuery测试

梦想的初衷 提交于 2019-12-02 14:53:04
1, 编写程序,实现: 选中其中一列的复选框时,该复选框所在行的背景色高亮显示(黄色)。 取消 选中复选框时,所在行的背景色恢复。 < ! DOCTYPE html > < html > < head > < meta charset = "utf-8" / > < title > < /title > < /head > < style type = "text/css" > table, table td { border: 1px solid darkslategrey ; } td { width: 100px ; height: 30px ; } .red { background: red ; } < /style > < body > 1、选中其中一列的复选框时,该复选框所在行的背景色高亮显示(黄色)。 2、取消选中复选框时,所在行的背景色恢复。 < div id = "div" > < table align = "center" > < p align = "center" > 员工信息 < /p > < tr > < td > < /td > < td > 姓名 < /td > < td > 薪水 < /td > < td > 年龄 < /td > < /tr > < tr > < td > < input type = "checkbox" / > < /td

Uipath 勾选checkbox

核能气质少年 提交于 2019-12-02 11:32:10
东京IT青年前线 http://www.rpatokyo.com/ Uipath 勾选checkbox 使用check Activity可以对check box 复选框进行勾选。 虽然Click也可以实现对复选框的勾选操作,但是Check Activity中有Check打钩,Uncheck去钩以及Toggle切换等事件,所以用Check更为方便。 Check:通常勾选 Uncheck:通常去掉勾选 Toggle:如果是已勾选状态则去掉。如果是未勾选状态则打钩。 ---------------------------------------------------------------------------------- 来源: https://www.cnblogs.com/huaweijapan/p/11743179.html

checkbox的选中以及遍历

痞子三分冷 提交于 2019-12-02 10:40:51
checkbox的几种遍历方法 html代码如下: 1 <div> 2 <input type="checkbox" name="ckb" value="1" />1 3 <input type="checkbox" name="ckb" value="2" />2 4 <input type="checkbox" name="ckb" value="3" />3 5 <input type="checkbox" name="ckb" value="4" />4 6 <input type="checkbox" name="ckb" value="5" />5 7 <input type="checkbox" name="ckb" value="6" />6 8 <input type="checkbox" name="ckb" value="7" />7 9 <input type="checkbox" name="ckb" value="8" />8 10 <input type="checkbox" name="ckb" value="9" />9 11 <input type="checkbox" name="ckb" value="10" />10<br> 12 <input type="button" id="btn" value="遍历"/> 13 <div id=

jQuery radio取值,checkbox取值,select取值

泪湿孤枕 提交于 2019-12-02 07:21:23
语法解释: 1 $("#select_id").change(function(){//code...}); //为Select添加事件,当选择其中一项时触发 2 var checkText=$("#select_id").find("option:selected").text(); //获取Select选择的Text 3 var checkValue=$("#select_id").val(); //获取Select选择的Value 4 var checkIndex=$("#select_id ").get(0).selectedIndex; //获取Select选择的索引值 5 var maxIndex=$("#select_id option:last").attr("index"); //获取Select最大的索引值 jQuery设置Select选择的Text和Value: 语法解释: 1 $("#select_id ").get(0).selectedIndex=1; //设置Select索引值为1的项选中 2 $("#select_id ").val(4); //设置Select的Value值为4的项选中 3 $("#select_id option[text='jQuery']").attr("selected", true); /

jquery获取表单值的一些简单操作汇总

拟墨画扇 提交于 2019-12-02 07:20:47
var mykindtxt=$("#kind option:selected").text();//获取表单selected 选中文本内容 jquery如何 取得 text,areatext,radio,checkbox,select 的值 , 以及其他一些操作 ; 假如我们有如下页面: < input type = " text " name = " textname " id = " text_id " value = "" > ...........在此不写出来了 下面来看怎么取得 FORM 中的各种值等等 ; function get_form_value (){ /* 获得 TEXT.AREATEXT 的值 */ var textval = $ ( " #text_id " ) . attr ( " value " ) ; // 或者 var textval = $ ( " #text_id " ) . val () ; /* 获取单选按钮的值 */ var valradio = $ ( " input[@type=radio][@checked] " ) . val () ; /* 获取复选框的值 */ var checkboxval = $ ( " #checkbox_id " ) . attr ( " value " ) ; /* 获取下拉列表中所有的值 */

自定义checkbox 复选框的样式以及控制 checkbox 复选框的大小

不想你离开。 提交于 2019-12-02 05:50:26
先定定义一个selector <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/group_selected" android:state_checked="true"/> <item android:drawable="@drawable/group_unselected" android:state_checked="false"/> <item android:drawable="@drawable/group_unselected"/> </selector> 在定义一个style <style name="CustomCheckboxTheme" parent="@android:style/Widget.CompoundButton.CheckBox"> <item name="android:button">@drawable/selector_group</item> </style> 引用即可 <CheckBox android:focusable="false" android:focusableInTouchMode="false" android:clickable="false" android

微信小程序-自定义button、checkbox组件

微笑、不失礼 提交于 2019-12-02 05:47:02
问题描述 微信小程序开发过程中,经常会存在需要自定义一些组件的情况,接下来我们介绍这次开发小程序我遇到的自定义button和checkbox。 自定义button 除了简单的用view或者其他标签模拟,加上背景图片完全放飞自由,还有特定需要button按钮,比如需要用微信自带的分享转发功能,有几点需要关注: <button class = 'btn btn-default' hover- class = "none" open - type = 'share' >分享看群关系</button> 1.设置 open-type='share' 2.重置样式 button{ background-color: transparent;} 3.书写按钮自定义样式 .btn-default { width : 170 px ; height : 49 px ; background-image : url(http:// 140.206 . 163.105 /test/zsgws/btn-share1.png) ; background-size : 170 px 49 px ; -webkit-background-size : 170 px 49 px ; } 4.去除边框 button::after{ border: none;} 可以看到按钮四边有一条不是很明显的边框

重写小程序CheckBox样式

落花浮王杯 提交于 2019-12-02 05:43:10
重写复选框样式 /* 未选中的 背景样式 */ checkbox .wx-checkbox-input { // border-radius: 50%;/* 圆角 */ width: 28rpx; /* 背景的宽 */ height: 28rpx; /* 背景的高 */ } /* 选中后的 背景样式 (红色背景 无边框 可根据UI需求自己修改) */ checkbox .wx-checkbox-input.wx-checkbox-input-checked { background: #776dff; border: 1rpx solid #776dff; } /* 选中后的 对勾样式 (白色对勾 可根据UI需求自己修改) */ checkbox .wx-checkbox-input.wx-checkbox-input-checked::before { width: 28rpx; /* 选中后对勾大小,不要超过背景的尺寸 */ height: 28rpx; /* 选中后对勾大小,不要超过背景的尺寸 */ line-height: 28rpx; text-align: center; font-size: 24rpx; /* 对勾大小 */ background: transparent; color: #fff; transform: translate(-50%, -50%)