jquery - 使用 JQuery/JavaScript 从选定的单选按钮返回范围文本

Question

我有一个单选按钮列表，其中只能选中一个。我想从选定的单选按钮中检索值。我似乎没有在返回的警报中收到任何文本。

请注意，此 HTML 是自动生成的，因此我无法编辑它。因此，增加值(value)是不可能的。

<form class="leaflet-control-layers-list">
<div class="leaflet-control-layers-base">
    <label>
        <input class="leaflet-control-layers-selector" type="radio" checked="checked" name="leaflet-base-layers"></input>
            <span>
                Gemeenten
            </span>
   </label>
   <label>
        <input class="leaflet-control-layers-selector" type="radio" name="leaflet-base-layers"></input>
            <span>
                Wijken
            </span>
   </label>
   <label>
       <input class="leaflet-control-layers-selector" type="radio" name="leaflet-base-layers"></input>
           <span>
               Buurten
           </span>
   </label>
</div>
</form>

这是我使用的 jQuery 脚本:

radioButtonText = $('input[name=leaflet-base-layers].leaflet-control-layers-selector:checked').html();
alert(radioButtonText);

有人知道如何根据选择的单选按钮返回文本“Gemeenten”、“Buurten”或“Wijken”吗？

Answer 1

在输入单选中设置值属性

<input value="Gemeenten" class="leaflet-control-layers-selector" type="radio" checked="checked" name="leaflet-base-layers">

并使用 .val() 方法获取 radio 输入值

radioButtonText = $('input[name=leaflet-base-layers].leaflet-control-layers-selector:checked').val();
alert(radioButtonText);

如果您需要 span html 内容:

radioButtonText = $('input[name=leaflet-base-layers].leaflet-control-layers-selector:checked');

var label_value = radioButtonText.closest('label').find('span').html();
alert(label_value);