★→ASP程序学习群:62655404 微信公众号开发
订阅本栏目 RSS您所在的位置: 深山工作室 > HTML学习 > 正文

jquery实现单选按钮radio选中和取消 使用prop()代替attr()

网络 2019/12/20 20:36:22  字体:  浏览 689 我要评论
当前标签
radio
<!DOCTYPE html>
<html lang="en">
<head><title>jquery实现单选按钮radio选中和取消 使用prop()代替attr()</title></head>
<body>

JQuery获取选中的radio<br>
$('input:radio[name="sex"]:checked')<br><br>

Jquery选中或取消radio<br>
$("#qwbmdanxuan1").attr("checked","checked");<br>
$("#qwbmdanxuan2").attr("checked",false);<br><br>



<input type="radio" name="aaa" value="第 1 个">
第 1 个<br>
<input type="radio" name="aaa" value="第 2 个">第 2 个<br>
<input type="radio" name="aaa" value="第 3 个">第 3 个<br>
<input type="radio" name="aaa" value="第 4 个">第 4 个<br>
<input type="radio" name="aaa" value="第 5 个">第 5 个<br><br>

<button class="btn1">点我除去选中项</button>
<button class="btn2">点我选中第二个</button>
<button class="btn3">点我选中第三个</button>
<button class="btn4">点我选中第四个</button>
<button class="btn5">点我选中第五个</button>
<script language="javascript" type="text/javascript" src="https://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
<script>
    /*//解决选中的单选框无法取消问题
    $(":radio").click(
        function(){
            var nm=$(this).attr("name");
            $(":radio[name="+nm+"]:not(:checked)").attr("tag",0);
            if($(this).attr("tag")==1){
                $(this).attr("checked",false);
                $(this).attr("tag",0);
            } else{
                $(this).attr("tag",1);
            }
        }
    );*/

    function de() {
        //错误示范,均会出现什么各种问题
        /*$.each($('input:radio'),function(i,v){
            $(v).attr('checked', false);
            $(v).removeAttr('checked');
            //v.checked = false;
            //v.removeAttribute("checked");
        })*/

        //$("input[name=aaa]").prop("checked",false);
        $('input:checked').prop('checked', false);
        //$("input[name=aaa]").removeAttr("checked")
    }

    $('.btn1').click(function () {
       de()
    })

    $('.btn2').click(function () {
        //de();
        $('input:radio').eq(1).prop('checked', true);

    })

    $('.btn3').click(function () {
        //de();
        $('input:radio').eq(2).prop('checked', true);

    })
    $('.btn4').click(function () {
        //de();
        $('input:radio').eq(3).prop('checked', true);

    })
    $('.btn5').click(function () {
        //de();
        $('input:radio').eq(4).prop('checked', true);

    })
   
</script>

</body>
</html>
相关阅读
( 2009/12/22 14:07:40 )告诉你一些GOOGLE搜索你不知道的东西
( 2009/9/26 10:02:24 )radio单选按钮组选择详细
( 2009/9/26 9:59:11 )radio组选择详细
( 2009/9/4 8:30:26 )超级实用且不花哨的js代码大全( 6 )
( 2009/3/24 21:22:58 )一些常见的网页设计小技巧
( 2008/6/27 21:18:25 )一个利用radio单选选择框进行变色的网页效果
( 2008/4/24 23:26:47 )了解html基础知识之html标签集合
( 2008/3/19 19:58:10 )CSS设计符合Web标准的网页表单的几个技巧
共有0条关于《jquery实现单选按钮radio选中和取消 使用prop()代替attr()》的评论
发表评论
正在加载评论……
返回顶部发表评论
呢 称:
表 情:
内 容:
评论内容:不能超过 1000 字,需审核,请自觉遵守互联网相关政策法规。
验证码: 验证码 
深山工作室网友评论声明,请自觉遵守互联网相关政策法规。

您发布的评论即表示同意遵守以下条款:
一、不得利用本站危害国家安全、泄露国家秘密,不得侵犯国家、社会、集体和公民的合法权益;
二、不得发布国家法律、法规明令禁止的内容;互相尊重,对自己在本站的言论和行为负责;
三、本站对您所发布内容拥有处置权。

更多信息>>栏目类别选择
rss学习
个人空间
网站设计
网站公告
下载
photoshop学习
ASP学习
DIV+CSS学习
SEO搜索引擎忧化
java学习
HTML学习
网站信息
网站类信息
更多>>同类信息
服务器iis配置.mp4视频格式文件播放(网页播放mp4有声音但没有图像画面)
安卓版微信中播放视频不自动全屏
网站从http改成https(ssl证书)后设置301跳转将http跳转到https的方法
jquery动态生成的html代码中无法使用jquery事件的解决方法
国内网站常用的一些 CDN 静态资源公共库加速服务
ios苹果版手机微信内置浏览器$(document).on(
最新县及县以上1980年以来历史行政区划代码大全截止2018年3月31日
页面里面的js和css的放的位置顺序与加载速度分析
更多>>最新添加文章
利用css3中的-webkit-font-smoothing把网页文字的毛边去掉
兼容pc、移动端用js实现复制内容到剪切板(支持苹果safari浏览器)
fiddler抓包在内容的SyntaxView窗口里面是乱码
服务器iis配置.mp4视频格式文件播放(网页播放mp4有声音但没有图像画面)
好用的免费桌面gif录制作屏幕软件
实现iis6与iis7环境下支持mp4视频随意拖动、预览播放、边下载边播放
解决手机端微信浏览器中视频自动播放和默认全屏问题
更多>>随机抽取信息
ASP FSO读取XX文件夹下的所有文件与创建使用时间
div+css中absolute标签与relative标签的巧妙运用
介绍JavaScript里比较和逻辑运算符
记录滚动条位置(使用userdate)
css里expression实现界面对象的批量控制
连云港电子杂志网站
ASP+Access随机读取数据库记录的方法
巧妙运用CSS样式表立刻改变鼠标的样式