如何从引导下拉菜单(jQuery)获取值

时间:2019-06-06 08:25:36

标签: javascript jquery html twitter-bootstrap websocket

我正在设置一个Web服务器,我想从Bootstrap下拉菜单对等Websocket发送选定的值。

我已经尝试过为所选项目设置一个值 data-value =“某值”和value =“某值”。并尝试使用jQuery。

createParagraphs()

在下拉菜单按钮中显示选定的值:

<div class="dropdown">
    <button class="btn dropdown-toggle config_btn" type="button" data-toggle="dropdown" id="btn_baud">
        <span class="caret"></span></button>
    <u1 class="dropdown-menu" id="baudrate">
        <li><a href="#">250 kBit/s</a></li>
        <li><a href="#">500 kBit/s</a></li>
        <li><a href="#">1 MBit/s</a></li>
    </u1>
</div>

从下拉菜单中获取所选文本:

$(document).ready(function(){
    $("#baudrate a").click(function(){
        $("#btn_baud").text($(this).text());
    });
});

我可以从下拉菜单中获取选定的文本,但无法获取值。

当我尝试设置以下值时:

$(document).ready(function() {
    $("#baudrate li a").click(function() {
        baudrate = $(this).html();
    });
});

我无法在我的jQuery中使用<li data-value="250"><a href="#">250 kBit/s</a></li> <li><a data-value="250" href="#">250 kBit/s</a></li> 来获取它。

2 个答案:

答案 0 :(得分:2)

它不重视其数据。

https://api.jquery.com/data/

$(element).data('value');

答案 1 :(得分:1)

HTML:

<div class="dropdown">
    <button class="btn dropdown-toggle config_btn" type="button" data-toggle="dropdown" id="btn_baud">
        <span class="caret"></span></button>
    <u1 class="dropdown-menu" id="baudrate">
        <li><input type="hidden" value="250"/><a href="#">250 kBit/s</a></li>
        <li><input type="hidden" value="500"/><a href="#">500 kBit/s</a></li>
        <li><input type="hidden" value="1"/><a href="#">1 MBit/s</a></li>
    </u1>
</div>

JS:

<script>
    $(document).ready(function(){
         $("#baudrate li a").click(function() {
            baudrate = $(this).parent().find('input').val();
            alert(baudrate);
        });
    });
</script>