Return 使用 JQuery/JavaScript 从选定的单选按钮跨度文本

Question

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

请注意，此 HTML 是自动生成的，因此我无法对其进行编辑。因此不可能为增加价值。

<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);

有人知道我如何 return 文本“Gemeenten”、“Buurten”或“Wijken”，具体取决于所选择的单选按钮吗？

Answer 1

在输入单选中设置一个值属性

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

并使用 .val() 方法获取无线电输入值

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

如果您需要跨度 html 内容：

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

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

Answer 2

获取单击的单选按钮的下一个 html。

$(document).ready(function(){
 $("input[type=radio]").click(function(e) {
        var inputs = $('input[type=radio]');
            alert($(this).next().html());

    });

});

工作fiddle： http://jsfiddle.net/5u94gzb8/

Answer 3

*) 您的选择器缺少项目名称周围的引号。

*) 如果您使用按钮名称，您可能不需要 class“.leaflet-control-layers-selector”。

*) 您不需要输入中的 .html() ，您需要来自以下跨度的输入，您可以使用 .next().

应该是：

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

Return 使用 JQuery/JavaScript 从选定的单选按钮跨度文本

Return span text from selected radio button using JQuery/JavaScript

html

jquery

radiobuttonlist

radio-button