带有 data-toggle=button 的 div 内的 asp.net Dropdownlist答案

【问题标题】：asp.net Dropdownlist inside a div with data-toggle=button带有 data-toggle=button 的 div 内的 asp.net Dropdownlist
【发布时间】：2019-02-28 03:52:08
【问题描述】：

我在具有 data-toggle="button" 的 div 中有一个 ASP.Net DropDownList，当我尝试在下拉列表中选择一个选项时，它会在我做出选择之前立即消失。我必须按住鼠标按钮才能进行选择。

我认为这与父 div 上的数据切换有关，因为当我删除它时，下拉列表工作正常。

这是简单的标记。

<asp:Repeater ID="ShippingTermsRepeater" runat="server" Visible="false">
    <HeaderTemplate>
        <div class="form-group onewCustomer clearfix">
            <label>Shipping Terms</label>
            <div class="btn-group radioDouble shipTermsRadio" data-toggle="buttons">
    </HeaderTemplate>
    <ItemTemplate> 
        <div class="btn btn-primary">
        <input id="ShippingTermsSelector" runat="server" type="radio" name="ShippingTermsGroup"/>
        <label for="ShippingTermsSelector">
            <span class="onewCurrency fontBlack"><asp:Literal ID="CurrencyLabel" runat="server" /></span>
            <span class="onewWHName fontBlack"><asp:Literal ID="WarehouseInternalNameLabel" runat="server" /></span>
            <span class="onewAccount"><asp:Literal ID="CustomerAccountCodeLabel" runat="server" /></span>
            <span class="onewTerms fontBlack"><asp:Literal ID="ShippingTermsLabel" runat="server" /></span>
        </label>
        <asp:DropDownList ID="ShippingTermsSelectList" runat="server" CssClass="form-control shippingTerms" AppendDataBoundItems="true">
        </asp:DropDownList>
    </div>
    </ItemTemplate>
    <FooterTemplate>
        </div>
    </div>
</FooterTemplate>
</asp:Repeater>

以前有人遇到过这个问题吗？

【问题讨论】：

我相信 data-toggle="buttons" 将点击动作添加到关联的 div 作为单选按钮的视觉提示。尝试在 DropDownList 上选择导致您的问题的某些内容时会触发。我没有给出答案，因为看起来您正在同时实施 2 个不同的“运输条款选择”流程（单选按钮切换列表和下拉列表），所以我不确定最终目标是什么.
感谢您的回复。根据选择的单选按钮，然后可以显示 DropDownList。是否可以为 DropDownList 单击事件添加任何 Javascript 覆盖以保持打开显示？

标签： html asp.net twitter-bootstrap webforms

【解决方案1】：

添加 stopPropagation();点击事件已修复。

$('select.shippingTerms').click(function (e) {
   e.stopPropagation();
})

【讨论】：