带输入的下拉菜单

Question

我想单击元素时，元素必须放入我的输入中。但我不知道该怎么做？

<div class="control-group span3 offset3 "> 

    <div class="input-append btn-group"> 
     <input id="appendedInputButton" type="text"> 
     <a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#"> 
      <span class="caret"></span> 
     </a> 
     <ul class="dropdown-menu"> 
     <!-- ko foreach: $data.phoneNumbers() --> 
      <li><span data-bind="text: $data.phoneNumber()"></span> </li> 
      <!-- /ko --> 
     </ul> 
    </div> 

http://imageup.fr/uploads/1377857115.jpeg

Answer 1

使用一些JQuery的它相当简单，首先包括如果尚未列入该库：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

添加您的功能：

JQuer Y：

$(".dropdown-menu li span").click(function() { 
    $('#appendedInputButton').val($(this).text()); 
}); 

JSfiddle Example

Answer 2

$('.dropdown-menu li').on('click', function(){ 
    $('#appendedInputButton').val($(this).text()); 
}); 

这个jQuery功能将采取点击下拉菜单项和

Answer 3

检查其放置在输入框出来的演示中，我想你想这样做只有DEMO

$('.dropdown-menu li span').click(function(){ 
    var elementVal=$(this).text(); 
    $('#appendedInputButton').val(elementVal); 
});