隐藏的单选按钮上的OnClick事件

Question

我正在使用引导程序。 在UI上的哪里，我必须显示多个按钮，这些按钮应表现为单选按钮。

<div class="btn-group" data-toggle="buttons">
  <label class="btn btn-primary active">
    <input type="radio" name="options" id="option1" onclick="javascript:a();" autocomplete="off" style="display:none;"/> Radio 1
  </label>
  <label class="btn btn-primary">
    <input type="radio" name="options" id="option2" onclick="javascript:a();" autocomplete="off" style="display:none;"/> Radio 2
  </label>
  <label class="btn btn-primary">
    <input type="radio" name="options" id="option3" onclick="javascript:a();" autocomplete="off" style="display:none;"/> Radio 3
  </label>
</div>

我想在单击这些按钮时调用onclick函数。 但似乎没有用。

function a(){
alert("test");
}

任何想法，我如何实现。 任何替代方式也将受到欢迎。 谢谢！

http://getbootstrap.com/javascript/

Answer 1

始终使用JQuery而不是内联处理程序来绑定您的点击处理程序是一个好习惯，例如：

$(function(){
    $("input[name='options']").click(a);
});

function a(){
    alert("test");   
}

看看这个小提琴

Answer 2

来自此页： 按钮-收音机上的Twitter Bootstrap onclick事件

$('input[name="options"]').change( function() {
  alert("test");
})

如果要从选中的单选按钮中检索值，则必须添加到每个单选按钮中：

value="myValue"

您可以使用以下方法检索此值：

  alert($(this).val());

Answer 3

jQuery最简单的方法

$('[name="options"]').click(function() {
    alert('test')
})

您可以使用data属性来传递参数

<input type="radio" name="options" data-foo="1" data-bar="2" />

和jQuery将是

$('[name="options"]').click(function() {
        alert($(this).data('foo'))
        alert($(this).data('bar'))
    })