<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

        <script type="text/javascript" src="scripts/jquery-3.3.1.js"></script>

    </head>

    <body>

        <div id="checkBoxDiv1">

            测试单选框

            <input type="radio" name="checkBox1" class="checkBox1"><input type="radio" name="checkBox1" class="checkBox1" checked="checked">

        </div>

        <script type="text/javascript">

            $(".checkBox1").on("click", function(){

                var i = 0;

                var parentEle = $(this).parent();

                var index = $(this).index();

                $(".checkBox1").each(function(){

                    var currentEle = parentEle.children(".checkBox1:eq(" + i + ")");

                    if(i == index){

                        currentEle.attr("checked", true);

                    }else{

                        currentEle.attr("checked", false);

                    }

                    i++;

                });

                i = 0;

                $(".checkBox1").each(function(){

                    var currentEle = parentEle.children(".checkBox1:eq(" + i + ")");

                    alert(currentEle.attr("checked"));

                    i++;

                });

            });

        </script>

    </body>

</html>

这个是用来满足特殊需求的勾选一个单选按钮checked设置为true,其他的同name的单选框checked都设置为false.

JavaScript/JQuery radioButton(单选按钮)练习20190409的更多相关文章

  1. jquery判断单选按钮radio是否选中的方法

    JQuery控制radio选中和不选中方法总结 一.设置选中方法 复制代码代码如下: $("input[name='名字']").get(0).checked=true; $(&q ...

  2. JavaScript jQuery 中定义数组与操作及jquery数组操作

    首先给大家介绍javascript jquery中定义数组与操作的相关知识,具体内容如下所示: 1.认识数组 数组就是某类数据的集合,数据类型可以是整型.字符串.甚至是对象Javascript不支持多 ...

  3. 在线运行Javascript,Jquery,HTML,CSS代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" http://www.w3.org/TR/xht ...

  4. javascript --- jQuery --- Deferred对象

    javascript --- jQuery --- Deferred对象 javascript的函数式编程是多么引人入胜,jQuery使代码尽可能的精简,intelligent! defer - 必应 ...

  5. javascript/jquery读取和修改HTTP headers

    javascript/jquery读取和修改HTTP headers jquery修改HTTP headers jQuery Ajax可以通过headers或beforeSend修改request的H ...

  6. 大量Javascript/JQuery学习教程电子书合集

    ［推荐分享］大量Javascript/JQuery学习教程电子书合集,送给有需要的人   不收藏是你的错^_^. 经证实,均可免费下载. 资源名称 资源大小   15天学会jQuery(完整版).pd ...

  7. ［推荐分享］大量Javascript/JQuery学习教程电子书合集，送给有需要的人

    不收藏是你的错^_^. 经证实,均可免费下载. 资源名称 资源大小   15天学会jQuery(完整版).pdf 274.79 KB   21天学通JavaScript(第2版)-顾宁燕扫描版.pdf ...

  8. 【推荐分享】大量JavaScript/jQuery电子书籍教程pdf合集下载

    不收藏是你的错^_^. 经证实,均可免费下载. 资源名称 资源大小   15天学会jQuery(完整版).pdf 274.79 KB   21天学通JavaScript(第2版)-顾宁燕扫描版.pdf ...

  9. 使用Javascript/jQuery将javascript对象转换为json格式数据 - 海涛的CSDN博客 - 博客频道 - CSDN.NET

    body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...

随机推荐

  1. vue-resourse 提交表单 使用formData

    通过formData对象可以组装一组用XMLHttpRequest发送请求的键/值对.它可以更灵活方便的发送表单数据,因为可以独立于表单使用.如果把表单的编码类型设置为multipart/form-d ...

  2. 出现"Unable to instantiate Action,xxxxx, defined for 'login' in namespace '/' xxxxx 解决办法

    转自:https://blog.csdn.net/heroful/article/details/17261169 问题原因: 在MyEclipse 利用SSH框架写程序,运行时出现 " U ...

  3. 交通规划_dijkstra

    问题描述 G国国王来中国参观后,被中国的高速铁路深深的震撼,决定为自己的国家也建设一个高速铁路系统. 建设高速铁路投入非常大,为了节约建设成本,G国国王决定不新建铁路,而是将已有的铁路改造成高速铁路. ...

  4. 时间戳 js 转换

    // 获取当前时间戳(以s为单位) var timestamp = Date.parse(new Date()); timestamp = timestamp / 1000; //当前时间戳为:140 ...

  5. CodeForces 719B Anatoly and Cockroaches (水题贪心)

    题意:给定一个序列,让你用最少的操作把它变成交替的,操作有两种,任意交换两种,再就是把一种变成另一种. 析:贪心,策略是分别从br开始和rb开始然后取最优,先交换,交换是最优的,不行再变色. 代码如下 ...

  6. [NEXT] 时间管理实践

    此文已由作者杨卫强授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. 我个人认为,浪费时间比较主要的原因有两个 工作缺乏计划 工作过程被打扰,效率低下 以下记录我自己的时间管理实 ...

  7. PTA QQ Account Manageme【map的巧妙应有】

    5-27 QQ Account Management (25分) You are supposed to implement the functions of account "Log in ...

  8. 开挂的map

    转自:http://blog.csdn.net/sunshinewave/article/details/8067862 #include<iostream> #include<ma ...

  9. 一个关于国密SM4的故事

    一个关于国密SM4的故事 我的名字叫SM4,我还有三位兄长,分别是大哥SM1, 二哥SM2, 和三哥SM3.说起我的名字,故事要回到2006年的时候,我出生的时候并不是叫SM4的,而是叫做SMS4.只 ...

  10. php in_array 的 坑

    话不多说,直接上代码 $str = '7.php'; var_dump(in_array($str,range(0,100))); die; 是 true 这是因为 php是弱类型语言,会把7.php ...