夏日博客

A-A+

jquery 获取radio属性值方法

2016年01月07日 前端设计 暂无评论 阅读 9 views 次

核心代码:

$('div.child :radio:checked',$(this).parents('div')).val()

有专门的选择器:first可以选中第一个，也可以通过$().eq(1)选中第一个,jquery功能强大,而且选择同一元素可以使用若干种选择方式.

对于radio的选中，虽然不直接支持，但是也有两个方式。

$(radio).attr("selected",true);

或$(radio).click(function(){});

下面看实例

  1. <div>  
  2.         <input id="radio1" type="radio" name="rad" value="1" checked />1  
  3.         <input id="radio2" type="radio" name="rad" value="2" />2  
  4.         <input id="radio3" type="radio" name="rad" value="3" />3  
  5.         <input id="radio4" type="radio" name="rad" value="4" />4  
  6.         <input id="radio5" type="radio" name="rad" value="5" />5  
  7.         <input id="button1" type="button" value="button" onclick="return button1_onclick()" />  
  8.         <input id="button2" type="button" value="button" onclick="return button2_onclick()" />  
  9.     </div>  
  10.   
  11.  <script language="javascript" type="text/javascript">  
  12. // <![cdata[  
  13.   
  14.         function button1_onclick() {  
  15.             $("input").each(function () {  
  16.                 if (this.type == 'radio') {  
  17.                     alert($(this).val());  
  18.                 }  
  19.             });  
  20.         }  
  21.   
  22.         function button2_onclick() {  
  23.             //alert($("input[@type=radio]:checked").val());  
  24.             //alert($("input[name='rad']:checked").val());  
  25.             alert($("input[@type=radio]").val());  
  26.         }  
  27.   
  28. // ]]>  
  29.     </script>  

代码二:

  1. <script type="text/javascript" src="jquery.js">   
  2.     </script>   
  3.      <script type="text/javascript">   
  4.          $(function(){   
  5.              $('#form1').submit(function(){   
  6.                  var item = $('input[@name=items][@checked]').val();   
  7.                  alert(item);   
  8.                  return false;   
  9.              });   
  10.          });   
  11.      </script>   
  12.      <title>get radio value document</title>   
  13. </head>   
  14. <body>   
  15.      <form id="form1">   
  16.          <input type="radio" name="items" id="item1" value="a"/>a   
  17.          <br/>   
  18.          <input type="radio" name="items" id="item2" value="b"/>b   
  19.          <br/>   
  20.          <input type="radio" name="items" id="item3" value="c"/>c   
  21.          <br/>   
  22.          <input type="radio" name="items" id="item4" value="d"/>d   
  23.          <br/>   
  24.          <input type="radio" name="items" id="item5" value="e"/>e   
  25.          <br/>   
  26.          <input type="radio" name="items" id="item6" value="f"/>f   
  27.          <br/>   
  28.          <input type="radio" name="items" id="item7" value="g"/>g   
  29.          <br/>   
  30.          <input type="radio" name="items" id="item8" value="h"/>h   
  31.          <br/>   
  32.          <input type="submit" id="btn1">   
  33.      </form>   
  34. </body>   
  35. </html>  
  36. $("div.child").closest("div")  

如果你无法判断怎么选择的话，加个id就行了，你应该知道就是优先的方式，因为id是查询最快的方式，而通过.class选择是最慢的方式

标签：

给我留言