引导复选框进入 TabPanel 选项卡不选中/取消选中

Question

问题是选项卡面板选项卡内的复选框不检查。

JSFiddle link

HTML代码在这里：

<ul class="nav nav-tabs" id="myTab">
    <li class="active">
        <a href="#home">
            <div style="margin: 0;" class="checkbox">
                <label style="float: left;">
                    <input style="display: inline-block;" type="checkbox" id="product" value="home" />
                    <div style="display: inline-block;">Home</div>
                </label>
            </div>
        </a>
    </li>
    <li>
        <a href="#profiles">
            <div style="margin: 0;" class="checkbox">
                <label style="float: left;">
                    <input style="display: inline-block;" type="checkbox" id="product" value="profiles" />
                    <div style="display: inline-block;">Profiles</div>
                </label>
            </div>
        </a>
    </li>
    <li>
        <a href="#messages">
            <div style="margin: 0;" class="checkbox">
                <label style="float: left;">
                    <input style="display: inline-block;" type="checkbox" id="product" value="messages" />
                    <div style="display: inline-block;">Messages</div>
                </label>
            </div>
        </a>
    </li>
</ul>

有什么想法吗？如何让这些复选框执行选中和取消选中功能？

Answer 1

你的 jquery 会是

$('#myTab li').click(function (e) {
 // e.preventDefault();
    $(this).find('a').tab('show');
 // $(this).tab('show');
     $(this).closest('ul').find('input[type="checkbox"]').prop('checked','');
     $(this).closest('li').find('input[type="checkbox"]').prop('checked','checked');

});

DEMO

Answer 2

您正在阻止它点击。删除e.preventDefault() 即可解决问题