Twitter bootstrap 引导切换时的单选选项标签

我正在尝试对单选选项组的标签应用重样式

但是，我还需要它来切换页面上的div

我使用的代码是：

<div>

                <ul class="nav nav-pills mb-3 row" id="pills-tab" role="tablist">

                    <li class="nav-item col-6">
                        <input id="dpm_dpmc_type_C" class="dpmc_type d-none" name="dpm_dpmc_type" type="radio" value="C" data-type="C" checked="">
                        <label for="dpm_dpmc_type_C" class="nav-link active" id="dpmc_C_tab" data-toggle="pill" href="#dpmc_C" role="tab" aria-controls="dpmc_C" aria-selected="true">
                            <strong>Accounting Prep</strong>
                            <div class="small text-muted">
                                For revisions needed to accounting prep (14 categories)
                            </div>
                        </label>
                    </li>

                    <li class="nav-item col-6">
                        <input id="dpm_dpmc_type_A" class="dpmc_type d-none" name="dpm_dpmc_type" type="radio" value="A" data-type="A">
                        <label for="dpm_dpmc_type_A" class="nav-link " id="dpmc_A_tab" data-toggle="pill" href="#dpmc_A" role="tab" aria-controls="dpmc_A" aria-selected="false">
                            <strong>Affidavit Work</strong>
                            <div class="small text-muted">
                                For issues found with affidavits and supporting docs (2 categories)
                            </div>
                        </label>
                    </li>

                </ul>

                <div class="row mb-3">

                    <div class="col-12">

                        <div class="th-inline">
                            Category
                        </div>

                        <div class="tab-content" id="dpmc-tabContent">

                            <div class="tab-pane fade show active" id="dpmc_C" role="tabpanel" aria-labelledby="dpmc_C_tab">

                                <div class="dropdown bootstrap-select form-control dpm_dpmc_id_C smart_dropdown"><select class="form-control dpm_dpmc_id_C smart_dropdown" id="dpm_dpmc_id_C" data-recs="dpmc_recs_C" data-selected-id="" data-live-search="true" title="None"><option class="bs-title-option" value=""></option><option value="12">Closing Calendar Incorrect</option><option value="3">Closing Statement Incorrect</option><option value="7">CSS Incorrect</option><option value="8">Document Missing</option><option value="16">Incorrect Seller Proceeds Form</option><option value="17">Missing Seller Proceeds Form</option><option value="10">Other</option><option value="14">Payoff Document Missing</option><option value="13">Payoff Info Incorrect</option><option value="9">Payoff Info Incorrect</option><option value="11">Prep Sheet Incorrect</option><option value="15">Removal Affidavit Incorrect</option><option value="5">Removal Affidavit Missing</option><option value="4">Tax Not Collected</option></select><button type="button" tabindex="-1" class="form-control dropdown-toggle bs-placeholder" data-toggle="dropdown" role="combobox" aria-owns="bs-select-3" aria-haspopup="listbox" aria-expanded="false" data-id="dpm_dpmc_id_C" title="None"><div class="filter-option"><div class="filter-option-inner"><div class="filter-option-inner-inner">None</div></div> </div></button><div class="dropdown-menu " style="max-height: 284px; overflow: hidden; min-height: 183px;"><div class="bs-searchbox"><input type="search" class="form-control" autocomplete="off" role="combobox" aria-label="Search" aria-controls="bs-select-3" aria-autocomplete="list"></div><div class="inner show" role="listbox" id="bs-select-3" tabindex="-1" style="max-height: 214px; overflow-y: auto; min-height: 113px;"><ul class="dropdown-menu inner show" role="presentation" style="margin-top: 0px; margin-bottom: 0px;"><li><a role="option" class="dropdown-item" id="bs-select-3-0" tabindex="0"><span class="text">Closing Calendar Incorrect</span></a></li><li><a role="option" class="dropdown-item" id="bs-select-3-1" tabindex="0"><span class="text">Closing Statement Incorrect</span></a></li><li><a role="option" class="dropdown-item" id="bs-select-3-2" tabindex="0"><span class="text">CSS Incorrect</span></a></li><li><a role="option" class="dropdown-item" id="bs-select-3-3" tabindex="0"><span class="text">Document Missing</span></a></li><li><a role="option" class="dropdown-item" id="bs-select-3-4" tabindex="0"><span class="text">Incorrect Seller Proceeds Form</span></a></li><li><a role="option" class="dropdown-item" id="bs-select-3-5" tabindex="0"><span class="text">Missing Seller Proceeds Form</span></a></li><li><a role="option" class="dropdown-item" id="bs-select-3-6" tabindex="0"><span class="text">Other</span></a></li><li><a role="option" class="dropdown-item" id="bs-select-3-7" tabindex="0"><span class="text">Payoff Document Missing</span></a></li><li><a role="option" class="dropdown-item" id="bs-select-3-8" tabindex="0"><span class="text">Payoff Info Incorrect</span></a></li><li><a role="option" class="dropdown-item" id="bs-select-3-9" tabindex="0"><span class="text">Payoff Info Incorrect</span></a></li><li><a role="option" class="dropdown-item" id="bs-select-3-10" tabindex="0"><span class="text">Prep Sheet Incorrect</span></a></li><li><a role="option" class="dropdown-item" id="bs-select-3-11" tabindex="0"><span class="text">Removal Affidavit Incorrect</span></a></li><li><a role="option" class="dropdown-item" id="bs-select-3-12" tabindex="0"><span class="text">Removal Affidavit Missing</span></a></li><li><a role="option" class="dropdown-item" id="bs-select-3-13" tabindex="0"><span class="text">Tax Not Collected</span></a></li></ul></div></div></div>
                                <script type="application/json" id="dpmc_recs_C">[{"ID":12,"TITLE":"Closing Calendar Incorrect"},{"ID":3,"TITLE":"Closing Statement Incorrect"},{"ID":7,"TITLE":"CSS Incorrect"},{"ID":8,"TITLE":"Document Missing"},{"ID":16,"TITLE":"Incorrect Seller Proceeds Form"},{"ID":17,"TITLE":"Missing Seller Proceeds Form"},{"ID":10,"TITLE":"Other"},{"ID":14,"TITLE":"Payoff Document Missing"},{"ID":13,"TITLE":"Payoff Info Incorrect"},{"ID":9,"TITLE":"Payoff Info Incorrect"},{"ID":11,"TITLE":"Prep Sheet Incorrect"},{"ID":15,"TITLE":"Removal Affidavit Incorrect"},{"ID":5,"TITLE":"Removal Affidavit Missing"},{"ID":4,"TITLE":"Tax Not Collected"}]</script>

                            </div>

                            <div class="tab-pane fade " id="dpmc_A" role="tabpanel" aria-labelledby="dpmc_A_tab">

                                <div class="dropdown bootstrap-select form-control dpm_dpmc_id_A smart_dropdown"><select class="form-control dpm_dpmc_id_A smart_dropdown" id="dpm_dpmc_id_A" data-recs="dpmc_recs_A" data-selected-id="" data-live-search="true" title="None"><option class="bs-title-option" value=""></option><option value="18">Affidavit Example 1</option><option value="19">Affidavit Example 2</option></select><button type="button" tabindex="-1" class="form-control dropdown-toggle bs-placeholder" data-toggle="dropdown" role="combobox" aria-owns="bs-select-4" aria-haspopup="listbox" aria-expanded="false" data-id="dpm_dpmc_id_A" title="None"><div class="filter-option"><div class="filter-option-inner"><div class="filter-option-inner-inner">None</div></div> </div></button><div class="dropdown-menu " style="max-height: 623px; overflow: hidden; min-height: 54px;"><div class="bs-searchbox"><input type="search" class="form-control" autocomplete="off" role="combobox" aria-label="Search" aria-controls="bs-select-4" aria-autocomplete="list"></div><div class="inner show" role="listbox" id="bs-select-4" tabindex="-1" style="max-height: 553px; overflow-y: auto; min-height: 0px;"><ul class="dropdown-menu inner show" role="presentation" style="margin-top: 0px; margin-bottom: 0px;"><li><a role="option" class="dropdown-item" id="bs-select-4-0" tabindex="0"><span class="text">Affidavit Example 1</span></a></li><li><a role="option" class="dropdown-item" id="bs-select-4-1" tabindex="0"><span class="text">Affidavit Example 2</span></a></li></ul></div></div></div>
                                <script type="application/json" id="dpmc_recs_A">[{"ID":18,"TITLE":"Affidavit Example 1"},{"ID":19,"TITLE":"Affidavit Example 2"}]</script>

                            </div>

                        </div>

                    </div>

                </div>

            </div>

会计准备
会计准备所需的修订（14类）


宣誓书工作
针对宣誓书和证明文件中发现的问题（2类）


类别
结账日历不正确结账声明不正确css不正确单据缺失卖家收益表缺失卖家收益表其他支付单据缺失支付信息不正确支付信息不正确准备表不正确删除宣誓书不正确删除宣誓书未征收税款无
交割日历不正确
交割声明不正确
CSS不正确
文件缺失卖方收益表不正确卖方收益表缺失其他
支付文件缺失
支付信息不正确支付信息不正确
准备表不正确
删除附件vit不正确
免职宣誓书缺失
未征收税款

[{“ID”：12，“TITLE”：“交割日历不正确”}，{“ID”：3，“TITLE”：“交割声明不正确”}，{“ID”：7，“TITLE”：“CSS不正确”}，{“ID”：8，“TITLE”：“文件缺失”}，{“ID”：16，“TITLE”：“卖家收益表不正确”}，{“ID”：17，“TITLE”：“卖家收益表缺失”}，{“ID”：10，“TITLE”：“其他”}，{“ID”：14，“TITLE”：“支付文件缺失”}，{“ID”：13，“TITLE”“：“支付信息不正确”}，{“ID”：9，“标题”：“支付信息不正确”}，{“ID”：11，“标题”：“准备表不正确”}，{“ID”：15，“标题”：“免职宣誓书不正确”}，{“ID”：5，“标题”：“免职宣誓书缺失”}，{“ID”：4，“标题”：“未征收税款”}]
宣誓书示例1宣誓书示例2宣誓书示例2
[{“ID”：18，“标题”：“宣誓书示例1”}，{“ID”：19，“标题”：“宣誓书示例2”}]

切换似乎起作用，但未选中“隐藏单选”选项。我已在第页显示了该选项，可以确认单击标签不会更改所选选项

这就像引导切换在切换之后停止了单击事件的流