Bootstrap 3 单选按钮

Question

我正在使用Twitter Bootstrap 3和其新的单选按钮进行实验，但无法确定哪个按钮被选中。

我的按钮如下：

    <div class="form-group">
      <label for="inputLogType" class="col-lg-2 control-label">Log type</label>
      <div class="col-lg-10">
        <div class="btn-group" data-toggle="buttons">
          <label class="btn btn-primary">
            <input type="radio" name="inputLogType" id="splunk">Splunk
          </label>
          <label class="btn btn-primary">
            <input type="radio" name="inputLogType" id="pig">PIG
          </label>
        </div>          
      </div>            
    </div>

我可以通过$(".btn-group").click()得知是否有任何一个按钮被点击，但是在其中我无法得知哪个按钮被点击。我会通过jquery得到这2个按钮$("input[name='inputLogType']")，其中一个将拥有属性checked:true。然而，当我执行$("input[name='inputLogType']:checked")时，没有任何内容显示。

有人知道问题出在哪里吗？

- Penguinator

---

结果证明，如果我这样做 $("input[name='inputLogType']")[i].checked 是可以的，但是有没有人知道为什么我最初不能像上面展示的那样选择？ - Penguinator

你是否在点击回调函数中尝试访问:checked值？如果是这样，很可能该属性尚未被应用。你可以使用$(event.target).find('input');。 - BenjaminCorey

那个选择器对我有用：http://jsfiddle.net/QMsQU/1/（使用chrome）。你使用了什么javascript来显示$（“input [name ='inputLogType']：checked”）jQuery对象中的内容？ - Joe_G

@Joe_G 我只是在使用 console.log。奇怪的是它在 jsfiddle 上运行正常，但在我的应用程序中却不行。你认为这可能与 bootstrap 3 有关吗？ - Penguinator

你们没有注意到的是，Bootstrap没有使用单选按钮的默认“checked”属性，而是在被点击时向包含单选按钮的标签添加“active”类。 - bafromca

Answer 1

你是否尝试在点击回调中访问:checked值？ 如果是这样，那么该属性很可能尚未应用。

您可以使用$(event.target).find('input');来选择目标单选按钮。

- BenjaminCorey

---

我不得不使用$(event.target).find('input')[0];来获取DOM元素（而不是jQuery元素）。 - Boggin