Question

我正在尝试使用Bootstrap上的jquery进行下拉选择，对我来说这似乎很难做到。这是我的代码：

<div id="green" class="X dropdown mt-4 pb-3">
    <button id="btn" type="button" class="btn btn-default dropdown-toggle " data-toggle="dropdown">Select
        languange</button>

    <button class="dropdown-menu">
        <a id="1" class="dropdown-item" href="#">English</a>
        <a id="2" class="dropdown-item" href="#">German</a>
        <a id="3" class="dropdown-item" href="#">French</a>
    </button>
</div>

$('.classdropdwn').click(function(){$('.classbutton').html( $(this).text)})

我也尝试过这样的尝试：

$(document).ready(function(){
    $('#btn').click(function(){
        $("#btn").empty()
        $("#btn").html( $(this).text)
    });                 
});

谢谢您的帮助！

Answer 1

您可以这样做，这也是我完成的示例代码

$(document).ready(function(){
    $('#btn').click(function(){
     $('.dropdown-menu').toggle();
    });                 
});

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.2/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="green" class="X dropdown mt-4 pb-3">
    <button id="btn" type="button" class="btn btn-default dropdown-toggle " data-toggle="dropdown">Select
        languange</button>

    <button class="dropdown-menu">
        <a id="1" class="dropdown-item" href="#">English</a>
        <a id="2" class="dropdown-item" href="#">German</a>
        <a id="3" class="dropdown-item" href="#">French</a>
    </button>
</div>

查询下拉选择的选项

1 个答案: