如何使用jQuery获取选中单选按钮的值

How to get value of selected radio button with jQuery

本文关键字:单选按钮 何使用 jQuery 获取      更新时间:2024-06-19

我正试图将所选单选按钮的值赋予元素.active-color

active-color中的文本应更改为选定的单选按钮。我错过了什么?

HTML

<div class="swatch">
   <div class="swatch-element schwarz">       
      <div class="tooltip">Schwarz</div>        
      <input id="schwarz" type="radio" name="properties[Farbe]" value="Schwarz" data-image="url({{ 'schwarz.jpg' | asset_url }})" checked="checked">        
      <label for="schwarz"></label>        
   </div>
   <div class="swatch-element weiss">       
      <div class="tooltip">Weiss</div>        
      <input id="weiss" type="radio" name="properties[Farbe]" value="Weiss" data-image="url({{ 'weiss.jpg' | asset_url }})">        
      <label for="weiss"></label>        
   </div>
   <div class="swatch-element chamois">       
      <div class="tooltip">Chamois</div>        
      <input id="chamois" type="radio" name="properties[Farbe]" value="Chamois" data-image="url({{ 'chamois.jpg' | asset_url }})">        
      <label for="chamois"></label>        
   </div>
</div>
<span class="active-color"></span>

以及函数:

jQuery('.active-color').text($(".swatch input:checked").val());

可以是类名swatch,应该是swatch-element

jQuery('.active-color').text($(".swatch-element input:checked").val());

演示:Fiddle

您在swatch下查找输入,但它是swatch-element所以改变低于线

jQuery('.active-color').text($(".swatch input:checked").val());

jQuery('.active-color').text($(".swatch-element input:checked").val());

使用这个你使用了错误的类名swatch它应该是swatch-element

jQuery('.active-color').text($(".swatch-element input:checked").val());