象形文字的Bootstrap样式作为按钮

时间:2014-10-07 22:19:49

标签: javascript css twitter-bootstrap

我正在构建包含一系列输入的页面。其中一个是电子邮件地址的选择列表。我在列表的右端包含一个Plus字形,作为一个按钮来调用一些javascript,它将为更多的收件人添加额外的选择列表。

在没有我希望的结果的情况下,我花了很多时间尝试这样做。我能做的最好的就是这个代码示例。如果直接单击加号,则会得到结果。但是,我希望字形周围的整个方块都是可点击的 - 与按钮不同。有什么建议?谢谢!

<div class="form-group">
  <label for='the_user_email' class='col-sm-2 control-label' style='padding-right: 0px;'>Requested By</label>
  <div class='col-sm-6'>
    <div class="input-group" id="add_emails_event">
      <select class='form-control' name='the_user_email' id='the_user_email'>
        <option value='user1@domain.com'>user1@domain.com
        <option value='user2@domain.com'>user2@domain.com
      </select>
      <span class="input-group-addon"><a onclick="add_email();"><span class="glyphicon glyphicon-plus"></span></a></span>
    </div>
  </div>
</div>

1 个答案:

答案 0 :(得分:2)

您可以使用按钮解决此问题。

    <div class="form-group">
  <label for='the_user_email' class='col-sm-2 control-label' style='padding-right: 0px;'>Requested By</label>
  <div class='col-sm-6'>
    <div class="input-group" id="add_emails_event">
      <select class='form-control' name='the_user_email' id='the_user_email'>
        <option value='user1@domain.com'>user1@domain.com
        <option value='user2@domain.com'>user2@domain.com
      </select>
      <span class="input-group-btn"><button onclick="add_email();" class="btn btn-default"><span class="glyphicon glyphicon-plus"></span></button></span>
    </div>
  </div>
</div>