Question

我的HTML部分如下：

<input id="yes" save-value="yes" value="no" name="view_y" class="switch-input yes" type="radio">
<label checked="checked" class="switch-label switch-label-off selected" for="yes">Yes</label>
<input id="no" save-value="no" value="no" name="view_n" class="switch-input no" type="radio">
<label class="switch-label switch-label-on" for="no">No</label>
<span class="switch-selection"></span>

当我点击每个按钮选中=“已选中”时，所选选项将从是变为无标签。

使用这些选项，如何获取所选单选按钮的保存值。因为，我在我的值选项上使用Handlebars js（json）我想获得所选单选按钮的保存值。

我是怎么做到的？

Answer 1

假设类switch-input仅分配给这两个输入元素，您可以将它与选中的选择器一起使用

var value = $('input.switch-input').filter(':checked').attr('save-value');
//or var value = $('input.switch-input:checked').attr('save-value');

注意：更喜欢使用data- *属性来存储自定义属性

我认为实际上没有检查单选按钮，只更改了标签属性，因此在标签myclass

中添加了一个额外的类

<input id="yes" save-value="yes" value="no" name="view_y" class="switch-input yes" type="radio"/>
<label checked="checked" class="myclass switch-label switch-label-off selected" for="yes">Yes</label>
<input id="no" save-value="no" value="no" name="view_n" class="switch-input no" type="radio"/>
<label class="myclass switch-label switch-label-on" for="no">No</label>
<span class="switch-selection"></span>

然后

var value = $('.myclass[checked="checked"]').prev('input').attr('save-value');
console.log(value)

Answer 2

首先，您的单选按钮应具有相同的名称属性，例如view，以便浏览器将选择仅限于其中一个。然后，您可以使用$('[name="view"]:checked').val()来捕获所选单选按钮的值。

Answer 3

您的HTML代码中存在一些错误，您将checked属性放在错误的标记上，请查看此示例：

$('body').on('change','input',function() {
   $('.switch-selection').html($(this).attr('save-value'));
});

http://jsfiddle.net/9Pj3g/2/

如何获取所选单选按钮的值

3 个答案: