javascript - Twitter Bootstrap下拉列表的事件处理程序发送的值是多少？

告诉我如何传递从列表框中选择的值

JavaScript：

$('.dropdown-menu li').click(function(e){
  e.preventDefault();
  var selected = $(this).text();
  $('.category').val(selected);
});

的HTML

<div class="container">
    <div class="col-sm-7 pull-right well">
      <form class="form-inline" action="#" method="get">
        <div class="input-group col-sm-8">
          <input class="form-control" type="text" value="" placeholder="Search" name="q">
       <div class="input-group-btn">
        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Action <span class="caret"></span></button>
        <ul class="dropdown-menu">
          <li><a href="#" id="action-1">1</a></li>
          <li><a href="#" id="action-1">2</a></li>
          <li><a href="#" id="action-1">3</a></li>
        </ul>
         <input type="hidden" name="category" class="category">
      </div><!-- /btn-group -->
        </div>
        <button class="btn btn-primary col-sm-3 pull-right" type="submit">Search</button>
      </form>
    </div>
</div>

在弹出窗口中允许我选择“ 1”传递给class =“ form-control” value =“ 1”

这是示例代码：
http://bootply.com/93417

最佳答案

您将值放在一个名为category的隐藏文本框中。如果希望在搜索字段中添加它，请在其class属性中添加一个新类（在本例中为box），并在脚本中调用它：

链接：http://bootply.com/98806

像这样：

<div class="container">
<div class="col-sm-7 pull-right well">
  <form class="form-inline" action="#" method="get">
    <div class="input-group col-sm-8">
      <input class="form-control box" type="text" value="" placeholder="Search" name="q">
   <div class="input-group-btn">
    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Select <span class="caret"></span></button>
    <ul class="dropdown-menu">
      <li><a href="#">1</a></li>
      <li><a href="#">2</a></li>
      <li><a href="#">3</a></li>
    </ul>
     <input type="hidden" name="category" class="category">
  </div><!-- /btn-group -->
    </div>
    <button class="btn btn-primary col-sm-3 pull-right" type="submit">Search</button>
  </form>
</div>

并相应地更改脚本

$('.dropdown-menu li').click(function(e){
   e.preventDefault();
   var selected = $(this).text();
   $('.box').val(selected);
});