zoukankan      html  css  js  c++  java
  • jQuery获取radio选中后的文字

    HTML 示例如下:

    <input type="radio" id="male" name="sex" value="1" />男  <input type="radio" id="female" name="sex" value="2" />女  

    在这里直接给出  jQuery 获取 radio 选中后的文本 的方法,如下:

    $("input[name='sex']:checked")[0].nextSibling.nodeValue;  

    方法将  jQuery 对象转换为 DOM 对象 后,再使用原生的 javascript 方法获取文本。在我回复朋友前,他通过在 radio 后添加 span 标记来解决这个问题:

    <input type="radio" id="male" name="sex" value="1" /><span>男</span>  

    接来下获取时使用 next() 选择器,如下:

    $("input[name='sex']:checked").next("span").text();

    问题看似到这里就结束了,其实不然,这并不是好的用户体验。好的做法应该为 radio 添加 for 标记,这样在点击 radio 文本"男"或"女"的时候也能选中 radio,这比让用户点击一个小圆圈容易多了。所以最好的 HTML 标记应该如下:

    <input type="radio" id="male" name="sex" value="1" />  <label for="male">男</label>  <input type="radio" id="female" name="sex" value="2" />  <label for="female">女</label>  

    最后获取 radio 选中后的文本我相信你已经会了,如下:

    $("input[name='sex']:checked").next("label").text();






    一份耕耘,一份收获,付出就有回报永不遭遇过失败,因我所碰到的都是暂时的挫折
  • 相关阅读:
    寻找大富翁
    C++ STL sort()函数用法
    众数
    平方因子
    Hdu 1089 A+B for Input-Output Practice (I)
    Hdu 1090 A+B for Input-Output Practice (II)
    Hdu 1083 Courses
    Hdu 1069 Monkey and Banana
    Hdu 1062 Text Reverse
    Hdu 1068 Girls and Boys
  • 原文地址:https://www.cnblogs.com/raincedar/p/14955472.html
Copyright © 2011-2022 走看看