引导程序下拉事件

如何选择具有li元素事件的值？引导程序下拉事件

<div class="btn-group" role="group"> 
    <button type="button" data-toggle="dropdown" value="1" class="btn btn-default btn-sm dropdown-toggle"> 
     Select <span class="caret"></span> 
    </button> 
    <ul class="dropdown-menu" id="dropDownId"> 
    </ul> 
    </div>

我往里面动态

for(var i = 0; i < data.stuff.length; i++){ 

    $("#dropDownId").append("<li><a data-value='"+i+"'>"+data.stuff[i].name+"</a></li>") 
}

如何获得在li元素的值？我试过不同的版本，但没有任何工作。

来源

2017-09-16 Pero

希望这有助于。您需要将click event附加到下拉列表的a标记，并在具有selected ID的范围中显示所选文本。

$('#dropDownId a').click(function() { 
    $('#selected').text($(this).text()); 
});

$(function() { 
 
\t for (var i = 0; i < 10; i++) { 
 
\t  $("#dropDownId").append("<li><a data-value='" + i + "'>" + i + "</a></li>") 
 
\t } 
 

 
\t $('#dropDownId a').click(function() { 
 
\t  $('#selected').text($(this).text()); 
 
\t }); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" /> 
 

 
<div class="container"> 
 
\t <div class="btn-group" role="group"> 
 
\t \t <button type="button" data-toggle="dropdown" value="1" class="btn btn-default btn-sm dropdown-toggle"> 
 
\t \t \t <span id="selected">Select</span><span class="caret"></span> 
 
\t \t </button> 
 
\t \t <ul class="dropdown-menu" id="dropDownId"> 
 
\t \t </ul> 
 
\t </div> 
 
</div>

来源

2017-09-16 09:13:32

谢谢老兄！它工作正常。 – Pero

欢迎您:) –

for(var i = 0; i < 4; i++){ 
 

 
    $("#tmplDropDown").append("<li><a data-value='"+i+"'>test</a></li>") 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 

 
<div class="btn-group" role="group"> 
 
    <button type="button" data-toggle="dropdown" value="1" class="btn btn-default btn-sm dropdown-toggle"> 
 
     Select <span class="caret"></span> 
 
    </button> 
 
    <ul class="dropdown-menu" id="tmplDropDown"> 
 
    </ul> 
 
    </div>

来源

2017-09-16 09:08:08 Pritamkumar

引导程序下拉事件

回答

相关问题