Question

从jQuery如何在此HTML

中拉回数据值或Id

<div class="input-group">
    <div class="btn-group" data-toggle="buttons" id="OptVacant">
        <label class="btn btn-default">
            <input type="radio" name="OptVacantOrOccupied" data-value="1" id="1"> Vacant
        </label>
        <label class="btn btn-default">
            <input type="radio" name="OptVacantOrOccupied" data-value="0" id="0"> Occupied
        </label>
        <label class="btn btn-default">
            <input type="radio" name="OptVacantOrOccupied" data-value="2" id="2" checked="checked"> Show All
        </label>
    </div>
</div>

Answer 1

在jquery中使用.. data()获取数据属性值，this.id获取ID

使用点击事件

$('input[name="OptVacantOrOccupied"]').click(function(){
   alert("id = " + this.id)  //alert id
   alert($(this).data('value'));  //alert data-value
})

当点击任何收音机时，这会给你一个警报

与其他人一样好，如果您需要检查无线电的数据值和身份证明，那么您可以使用:checked

 $('input[name="OptVacantOrOccupied"]:checked').data('value'); //alert data-value
 $('input[name="OptVacantOrOccupied"]:checked').attr('id'); //alert data-value

Answer 2

这将返回所选单选按钮的ID：

$("input[name='OptVacantOrOccupied']:checked").attr("id")

这将返回与所选无线电相关的数据：

$("input[name='OptVacantOrOccupied']:checked").data("value");

您还可以将事件处理程序附加到所有无线电的change事件：

$("input[name='OptVacantOrOccupied']").change(function(){   
    console.log($("input[name='OptVacantOrOccupied']:checked").data("value"));
});

JS小提琴： http://jsfiddle.net/cJZ6y/

Answer 3

您可以使用.data()

var value = $('.input-group :checked').data('value'); 
//Gets the checked radio data value

Answer 4

使用value代替data-value

var selected = $("input[type='radio'][name='OptVacantOrOccupied']:checked");
    if (selected.length > 0) 
      selectedVal = selected.val();

无法从Radio组获取数据值

4 个答案: