Jquery Bootstrap按钮组复选框值

时间:2015-09-05 04:59:58

标签: jquery twitter-bootstrap

我似乎无法获得任何复选框/单选按钮值。下面的代码是我认为阅读大量帖子后最合乎逻辑的,但仍然无效。

我的PHP

<!-- Account Type -->
<input type="hidden" id="hidden-accounttype">
<div class="form-group">
  <label class="col-sm-4 control-label" for="accounttype">Account Type</label>
  <div class="col-sm-4">
  <div class="btn-group btn-group-custom btn-block" data-toggle="buttons">
    <label class="btn btn-default col-xs-6 active">
      <input type="radio" name="accounttype" id="accounttype-0" class="button-accounttype" value="broker">Broker
    </label>
    <label class="btn btn-default col-xs-6">
      <input type="radio" name="accounttype" id="accounttype-1" class="button-accounttype" value="client">Client
    </label>
  </div>
  </div>
</div>

我的JS

$('.button-accounttype').click(function(){
  var values = $(this).val();
  $('#hidden-accounttype').val(values);
  alert($("#hidden-accounttype").val());
});

我也试过

alert($(".active").val());

小提琴(第一次做小提琴,所以请原谅我,如果我没有得到正确的bootstrap / jquery扩展设置)

http://jsfiddle.net/3u7p71z6/

1 个答案:

答案 0 :(得分:0)

由于input标记包含在label标记内,因此点击事件由label标记触发,而不是input标记。因此,我在.labelZ标记中添加了一个类label,并将脚本修改为:

$(document).ready(function () {
    $('.labelZ').click(function(){
        var values = $(this).find("input").val();
        $("#hidden-accounttype").val(values);
        alert($("#hidden-accounttype").val());
    });
});

更新了fiddle