1 <!DOCTYPE HTML>
2 <html>
3 <meta charset="UTF-8">
4 <meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no" />
5 <head>
6 <title>单选按钮de选中与取消</title>
7 </head>
8 <body>
9 <form>
10 <!--当name相同时，单选框的只会选择你最后点击的那个框-->
11 <input type="radio" name="name" value="Internet Explorer">IE<br />
12 <input type="radio" name="name" value="Firefox">谷歌<br />
13 <input type="radio" name="name2" value="Netscape">火狐<br />
14 <input type="radio" name="name3" value="Opera">Opera<br />
15 </form>
16
17 </body>
18 <script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
19 <script type="text/javascript">
20 $(function(){
21 $('input:radio').click(function(){
22 //alert(this.checked);
23
24 var domName = $(this).attr('name');
25
26 var $radio = $(this);
27 // if this was previously checked
28 if ($radio.data('waschecked') == true){
29 $radio.prop('checked', false);
30 $("input:radio[name='" + domName + "']").data('waschecked',false);
31 //$radio.data('waschecked', false);
32 } else {
33 $radio.prop('checked', true);
34 $("input:radio[name='" + domName + "']").data('waschecked',false);
35 $radio.data('waschecked', true);
36 }
37 });
38 });
39 </script>
40 </html>
