如何删除列表中的“选择”

Question

如何在选择选项时将“选择”作为占位符，而不是在单击它时位于下拉列表中？任何想法？

谢谢！所有的

<div class="form-group"> 
    <label class="control-label" for="name">Hours of Operation:</label> 
    <div class="input-group"> 
     <span class="input-group-addon"><i class="fa fa-clock-o"></i></span> 
     <select class="form-control" name="hours-of-operation" class="selectpicker"> 
      <option>Select</option> 
      <option value="Business Hours">Business Hours</option> 
      <option value="After Business Hours">After Business Hours</option> 
      <option value="24/7">24/7</option> 
     </select> 
    </div> 
</div> 

Answer 1

只需设置value=""并没有被选择的值中止事件处理程序。

<select class="form-control" name="hours-of-operation" class="selectpicker"> 
    <option value="">Select</option> 
    <option value="Business Hours">Business Hours</option> 
    <option value="After Business Hours">After Business Hours</option> 
    <option value="24/7">24/7</option> 
</select> 

Answer 2

首先，我建议做它时，选择的价值，实际上改变，而不是当它只是点击。这个想法是从选择中删除第一个选项元素。像这样：

$('select').one('change', function(e) { 
    $(this).find('option').first().remove(); 
}); 

显然有许多不同的方法来实现相同的事情，所以请选择。

下面是一个工作示例。

http://jsfiddle.net/h7aVC/1/