radio

原理：大致原理都是使用原生的checkbox或input标签，在其后面设置相关联的label元素。给<input>元素设置为透明，然后通过定位让用户看到的是<label>元素，利用css的原生属性来判断用户的操作，设置选中后的label样式,即 input[type=checkbox]:checked+label{} 一、利用css3伪元素实现样式修改 html： <p>您的性别：</p> <div class="radio-sex"> <input type="radio" id="sex1" name="sex"> <label for="sex1"></label> <span>男</span> </div> <div class="radio-sex"> <input type="radio" id="sex2" name="sex"> <label for="sex2"></label> 女 </div> css： .radio-sex { position: relative; display: inline-block; margin-right: 12px; } .radio-sex input { vertical-align: middle; margin-top: -2px; margin-bottom: 1px; /*

目录 jquery引入 标签查找 层级选择器：（同css） 基础选择器 属性选择器 表单筛选器 链式表达式 操作标签 样式操作 css操作 位置操作 尺寸 文本操作 值操作 属性操作 文档操作 事件 移除事件(不常用) 事件委托 页面载入 jquery的each bootstrap 栅格系统 列偏移col-md-offset-x 列嵌套 jquery引入 下载链接：jQuery官网 https://jquery.com/ 中文文档：jQuery AP中文文档 <script src="jquery.js"></script> <script> </script> //第二种方式,网络地址引入 <!--<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>--> 下载 jquey方法找到的标签对象称为jquery对象 原生js找到的标签对象称之为DOM对象 dom对象只能调用dom对象的方法,jquery对象只能用jquery方法,不能互通 jquery对象和dom对象互相转换 /jQuery对象转成DOM对象，通过一个jQuery对象+[0]索引零，就变成了DOM对象，就可以使用JS的代码方法了，DOM对象转换成jQuery对象：$(DOM对象)，通过$符号包裹一下就可以了 jquery对象

Cakephp 3 create a radio container with label -> input like that <div class="radio"> <label class="radio-acces-checked" for="condition-access-1"> <input id="condition-access-1" type="radio" value="1" name="condition_access"> Free access </label> </div> ... I would like change structure but it does not work, it's always the same strucure... Do you have an idea about how to solve my problem ? $myTemplates = [ 'radioWrapper' => '<div class="radio">{{label}}{{input}}</div>' ]; echo $this->Form->radio('condition_access', [ ['value' => 1, 'text' => __('Free Access')], ['value' => 2, 'text' => __(

radio单选框样式设置 input[type=radio] { display: inline-block; vertical-align: middle; width: 20px; height: 20px; -webkit-appearance: none; background-color: transparent; border: 0; outline: 0 !important; line-height: 20px; color: #d8d8d8; } input[type=radio]:after { content: ""; display:block; width: 20px; height: 20px; border-radius: 50%; text-align: center; line-height: 14px; font-size: 16px; color: #fff; border: 3px solid #ddd; background-color: #fff; box-sizing:border-box; } input[type=radio]:checked:after { content: "L"; transform:matrix(-0.766044,-0.642788,-0.642788,0.766044,0,0); -webkit

代码 <template> <div id="app"> <input type="checkbox" v-model="v2" value="a"> <input type="checkbox" v-model="v2" value="b"> <input type="checkbox" v-model="v2" value="c"> {{v2}} <input type="radio" name="love" v-model="v3" value="aa"> <input type="radio" name="love" v-model="v3" value="bb"> {{v3}} </div> </template> <script> export default { data () { return { v2: ['a', 'b'], v3: 'aa' } } } </script> 在checkbox中，当value值在v2数组中能查询到，改checkbox就是选中状态，当对checkbox进行操作时，v2数组也同样变化 在radio中，由于只能有一项选中，所以v3是一个字符串，value值和其相等的就会被选中　　 来源： https://www.cnblogs.com/robinunix/p/11393429.html

页面： <div class="td_margin radio" style="margin-left: 1.5px"> 常用处理意见：<input type="radio" name="oper" value="阅" onclick="getRadio(this)">阅    <input type="radio" name="oper" value="阅(已终止下发)" onclick="getRadio(this)">阅(已终止下发) </div> <div class="td_margin"> <asp:TextBox ID="tbComment" runat="server" ></asp:TextBox> </div> js脚本： <script type="text/javascript"> //求单选按纽的值，适用单选项及多选项。未选返回false；有选择项，返回选项值。选项值并赋值给文本框。 function getRadio(oRadio) { var oRadioLength = oRadio.length; var oRadioValue = false; //alert("oRadioLength:["+oRadioLength+"]"); if (oRadioLength == undefined) { if (oRadio.checked) {

11.5 jQuery 引入方式： 方式一：本地引入 <script src="jquery-3.3.1.min.js"></script> <script> //注意，一定在引入jQuery之后，再使用jQuery提供的各种操作 code... </script> ​ 方式二：直接使用CDN <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script> <script> code... </script> 文档就绪事件： DOM文档加载的步骤 1. 解析HTML结构。 2. 加载外部脚本和样式表文件。 3. 解析并执行脚本代码。 4. DOM树构建完成。 5. 加载图片等外部文件。 6. 页面加载完毕 11.51 选择器 id选择器： $("#i1") 标签选择器： $("p") class选择器： $(".c1") 所有元素选择器： $("*") 交集选择器： $("div.c1") // 找到类为c1的div标签 并集选择器： $("#i1,.c1,p") // 找到所有id="i1"的标签和class="c1"的标签和p标签 层级选择器： $("x y"); // x的所有后代y（子子孙孙） $("x>y"); // x的所有儿子y（儿子） $("x+y") // 找到所有紧挨在x后面的兄弟y