html 的radio单选框如何实现互斥------radio只是input的type属性

先看看没有互斥的情况:

  1 <html>
  2 <body>
  3
  4 男性:<input type="radio" id="male" />
  5 <br />
  6 女性:<input type="radio" id="female" />
  7 <br />
  8
  9 </body>
 10 </html>
 11 

要实现互斥, 可以让名称一致, 比如:

  1 <html>
  2 <body>
  3
  4 男性:<input type="radio" id="male"  name="xxx"/>
  5 <br />
  6 女性:<input type="radio" id="female" name="xxx"/>
  7 <br />
  8
  9 </body>
 10 </html>
 11 

原文地址:https://www.cnblogs.com/ago-0912/p/9973338.html

时间: 2024-11-02 10:45:12

html 的radio单选框如何实现互斥------radio只是input的type属性的相关文章

checbox复选框实现radio单选框的单选功能

checbox复选框实现radio单选框的单选功能:大家知道复选框可以一次选中多个,单选按钮每次只能够选中其中的一个,但是单选按钮比较霸道,你选中以后,只能够且必须选中其中一个,所有下面就通过checkbox复选框模拟实现单选按钮的功能,但是能够取消选中的项.代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author"

纯css3实现的超炫checkbox复选框和radio单选框

之前为大家分享了好多css3实现的按钮.今天要为大家分享的是纯css3实现的checkbox复选框和radio单选框,效果超级炫.先让我们看看图吧! 在线预览   源码下载 这个实例完全由css3实现的没有任何js代码.下面我们一起看下实现代码吧 html代码: <div style="width:200px; float:left"> <label> <input type="checkbox" class="option-

css3的实现的checkbox复选框和radio单选框绚丽美化效果

css3的实现的checkbox复选框和radio单选框绚丽美化效果:在css3之前要美化单选框和复选框无非是使用图片进行相关的替换操作,并且还有很大的局限性.由于css3的出现,一切好像变的都变的轻松起来,并且效果非常的绚丽,这是使用css2无法做到的,下面就分享一段能够实现此功能的代码实例,需要的朋友可以做一下参考.代码如下: <!DOCTYPE html><html> <head> <meta charset=" utf-8"> &

h5 radio单选框样式设置

radio单选框样式设置 p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Helvetica; color: #000000 } span.s1 { } input[type=radio] { display: inline-block; vertical-align: middle; width: 20px; height: 20px; -webkit-appearance: none; background-color: transp

layui 获取radio单选框选中的值

Layui 获取 radio的值,layui判断radio选中的单选值 layui form 表单获取radio选中的值 首先准备两个radio <input type="radio" name="sex" value="男" title="男" lay-filter="ChoiceRadio"> <input type="radio" name="sex&q

flutter Radio单选框

单选框,允许用户从一组中选择一个选项. import 'package:flutter/material.dart'; class RadioDemo extends StatefulWidget { @override _RadioDemoState createState() => _RadioDemoState(); } class _RadioDemoState extends State<RadioDemo> { int _radioGroupA = 0; void _hand

Extjs的radio单选框的使用

Extjs的radio的FormPanel的代码如下: {  xtype : 'radiogroup',    fieldLabel : '是否置顶',    name:'isTop',     items : [{                boxLabel : '置顶',                name:'isTop',                inputValue : '1'                }, {                 boxLabel : '

[oldboy-django][2深入django]Form组件实现生成: select下拉框, checkbox复选框,radio单选框以及如何实现自定义数据格式要求

1 需求 - 1Form组件如何实现生成选择类标签: select,check, radio - 默认值 - 保留上次输入的值 - 2自定义验证规则 - RegexField - -

layui radio 单选框 效果 显示不来

$("input[name=sex][value=女]").attr("checked", data.data.adminInfoEntity.adminInfoSex == 1 ? true : false);$("input[name=sex][value=男]").attr("checked", data.data.adminInfoEntity.adminInfoSex == 2 ? true : false);$(&