http://www.w3school.com.cn/tags/tag_input.asp

以下是相关示例，转载 lfx_web：

<html>
<head>
<script src='jquery-1.9.1.min.js'></script>
<script>
window.onload = function(){
var dom_a = document.getElementById('a1');
var dom_b = document.getElementById("b1");
//alert("A="+dom_a.value+" || B="+dom_b.value);
}

//以下开始操作radio的取消和勾选
//原生js操作
function fn1(){
var dom_a = document.getElementById('a1');
var dom_b = document.getElementById("b1");
//勾选
dom_a.checked = true;
//dom_a.checked = 'false';
//dom_a.checked = 123;
//取消勾选
dom_b.checked = '';
//dom_b.checked = false;//取消勾选
//dom_b.checked = null;//取消勾选
//dom_b.checked = undefined;//取消勾选

}
//利用jQuery操作
function fn2(){
var jQ_a = $('#a2');
var jQ_b = $("#b2");
//勾选
jQ_a.prop('checked','abc');
//jQ_a.prop('checked','123');
//jQ_a.prop('checked','true');
//jQ_a.prop('checked',true);
//jQ_a.prop('checked',123);//数字可以
//jQ_a.prop('checked',-1);
//jQ_a.prop('checked',abc);//会报错,abc未定义 {所以预猜测checked只要有已定义的值即可实现选中(undefined代表未定义)}
//取消勾选
jQ_b.prop('checked','');
//jQ_b.prop('checked',false);
//jQ_b.prop('checked',null);
//jQ_b.prop('checked',undefined);//没有任何效果,不会报错
}

</script>
<style>
.own{
border:solid 2px red;
padding:20px 5px 20px 40px;
width:300px;
margin:80 0 0 500;
}
</style>
<head>
<body>
<!--
通过实验得知：
初始化让单选框选中有4种方法可以实现：
1、checked
2、checked='checked'(建议用此方法，此方法对浏览器可以有很好的兼容性)
3、checked='true'
4、checked=true
小提示：通过给checked属性复制,只要checked存在,
赋予任何值都可以初始化选中(eg:checked='aaa' 或 checked='false')
不赋值都可以实现初始化选中
测试成功案例：
[checked],[checked='checked'],[checked='true'],[checked=true],[checked='aaa'],[checked='false'],
[checked='undefined'],[checked=false],[checked=null],[checked=undefined],[checked=''],[checked='-1']

当有多个被选中时，最后选中的单选框为最后一个
-->

<div class='own'>
<label>A1</label><input id='a1' type='radio' value='1' name='test1' checked />
<label>B1</label><input id='b1' type='radio' value='2' name='test1' checked='checked'/>
<label>C1</label><input id='c1' type='radio' value='3' name='test1' checked='true' />
<label>D1</label><input id='d1' type='radio' value='4' name='test1' checked=true />
<button onclick='fn1()'>测试点击一下</button>
</div>

<div class='own'>
<label>A2</label><input id='a2' type='radio' value='1' name='test2' />
<label>B2</label><input id='b2' type='radio' value='2' name='test2' checked/>
<label>C2</label><input id='c2' type='radio' value='3' name='test2' />
<label>D2</label><input id='d2' type='radio' value='4' name='test2' />
<button onclick='fn2()'>测试点击一下</button>
</div>

</body>
</html>

<input>标签单、复选相关查询地址的更多相关文章

  1. 表单复选框input[type="checkbox"]

    <!DOCTYPE html> <html lang="zh"> <head> <title></title> < ...

  2. javascript入门 之 ztree (九 单/复选框问题)

    <!DOCTYPE html> <HTML> <HEAD> <meta http-equiv="content-type" content ...

  3. bootstrap 列表 表格 表单 复选 单选 多选 输入框组

    一.列表 ul li 二.表格 table  (http://www.runoob.com/bootstrap/bootstrap-tables.html) 1. 基本表格 <table cla ...

  4. Android布局——单复选框（今天上课的内容总结下）

    怎么感觉最近补充的都是监听器的内容,今天学长提了一个新的监听器,看起来很牛批(因为很长) // 添加文本更改的监听器, TextWatcher是监听器的回调接口 text.addTextChanged ...

  5. Android之单复选框及Spinner实现二级联动

    一.基础学习 1.图形学真的很神奇啊....查了些资料做出了3D云标签,哈哈...其实直接拿来用的,我们要效仿鲁迅先生的拿来主义,嘿嘿~~3D标签云就是做一个球面,然后再球面上取均匀分布的点,把点坐标 ...

  6. 轻量级表格插件Bootstrap Table。拥有强大的支持固定表头、单/复选、排序、分页、搜索及自定义表头等功能。

    Bootstrap Table是轻量级的和功能丰富的以表格的形式显示的数据,支持单选,复选框,排序,分页,显示/隐藏列,固定标题滚动表,响应式设计,Ajax加载JSON数据,点击排序的列,卡片视图等. ...

  7. 8个非常个性化的CSS3单/复选框

    单选框和复选框在网页表单中应用十分广泛,但是浏览器默认自带的单选框和复选框样式不仅不统一,而且大多都比较简单丑陋.本文给大家介绍了一些基于CSS3的个性化单选框和复选框,一些选中动画是基于jQuery ...

  8. AngularJS（六）：表单-复选框

    本文也同步发表在我的公众号“我的天空” 复选框 复选框只有两个值:true或者false,因此在AngularJS中,一般都是将复选框的ng-model绑定为一个布尔值属性,通过这两个布尔值来决定其勾 ...

  9. python selenium单/复选框操作

    一.单选:radio 1.首先是定位选择框的位置 2.定位id,点击图标就可以了,代码如下(获取url地址方法:把上面源码粘贴到文本保存为.html后缀后用浏览器打开,在浏览器url地址栏复制出地址就 ...

随机推荐

  1. JDBC——Java语言连接数据库的标准

    JDBC概述 API JDBC(Java DataBase Connectivity,java数据库连接)是一种用于执行SQL语句的Java API,可以为多种关系数据库提供统一访问,它由一组用Jav ...

  2. volatility内存取证

    最近参加了45届世界技能大赛的山东选拔赛,样题里有一个题如下: 师傅好不容易拿到了压缩包的密码,刚准备输入,电脑蓝屏 了... = =",题意简单明了,易于理解.一看就是内存取证的题并且已经 ...

  3. centos7忘记密码解决办法

    centos7重置密码: centos7一改以往风格,很多方面都做了改进,尤其是修改root密码,一般centos6以前直接进入grub然后从单用户模式进去就可以修改,可centos7不同,笔者今天修 ...

  4. bzoj 3513: [MUTC2013]idiots FFT

    bzoj 3513: [MUTC2013]idiots FFT 链接 bzoj 思路 参考了学姐TRTTG的题解 统计合法方案,最后除以总方案. 合法方案要不好统计,统计不合法方案. \(a+b< ...

  5. 请为CMyString类型编写构造函数、copy构造函数、析构函数和赋值运算符函数。

    如下为类型CMyString的声明,请为该类型编写构造函数.copy构造函数.析构函数和赋值运算符函数. class CMyString { public: CMyString(const char* ...

  6. Go语言学习之13 日志管理平台开发

    主要内容: 1. ElasticSearch介绍与使用2. kibana介绍与使用 1. ElasticSearch安装 详见上节内容2. kibana安装 (1) 下载ES,下载地址:https:/ ...

  7. 剑指offer-01

    好久没看java, 今天把 runoob 上的java基础简单过了一遍. 来吧,怎么整这个题目呢? 首先遇到的问题是java如何输入一个数组,而且这个数组并不知道长度是多少 用Scanner类 Sca ...

  8. oracle 将一个表复制到另外一个表里 .

    复制一个表到另一个表.视图.临时表 博客分类: oracle Oracle数据结构软件测试SQL 创建一个表new_table和old_table表结构一样(没有old_table的记录) creat ...

  9. Log4Net 常见格式说明（不断更新中）

    用户名  %username pc版本 另起一行 %newline

  10. 处女座与复读机 DP

    题目链接:https://ac.nowcoder.com/acm/contest/327/G 题意:给你两个字符串序列,让你根据第二个序列判断是不是 复读机,复读机会有以下特征 1.       将任 ...