实际的input复选框隐藏在花哨的div.toggle-group后面（display: none）。这个div只是用CSS做成一个复选框的样子，并用JavaScript进行切换。
事实上，复选框实际上是在场景后面被聚焦/标签化的，你只是无法在视觉上看到它，因为它是隐藏的。
如果需要，可以编写显式的JQuery来在隐藏的复选框被聚焦时聚焦外部元素。
下面是你需要包含的jQuery代码：

$( "input:checkbox" ).focus(function() {
  if($(this).is(':checked') == true) {
    $(this).next('.toggle-group').find('.toggle-on').attr('tabindex', '-1').focus();
  } else {
    $(this).next('.toggle-group').find('.toggle-off').attr('tabindex', '-1').focus();
  }
});

一个稍微不同的方法

var $toggle = $('input:checkbox');
var $toggleDiv = $toggle.parent();
$toggleDiv.attr('tabindex','0');                // allow focus
$toggleDiv.unbind('keypress').keypress((e) => { // have enter trigger toggle
    if (e.which===13) {
        e.preventDefault();
        var newState = $toggle.is(':checked') ? 'off' : 'on';
        $toggle.bootstrapToggle(newState);
    }
})

我用这种方法…

$('.cb').bootstrapToggle();
$('.cb').each(function () {
    var $cb = $(this);
    var $toggleDiv = $cb.parent();
    $toggleDiv.attr('tabindex', '0');
    $toggleDiv.unbind('keypress').keypress((e) => {
        console.log(e.which);
        if (e.which === 13 || e.which === 32) {
            $toggleDiv.click()
        }
    })
});