使用jQuery在列表框中选择值显示工具提示

Question

当列表框上的鼠标值为什么时，如何显示标题或工具提示？如下图所示？

Answer 1

参见example ::

<!-- Include custom code to handle the tooltip -->
<script type="text/javascript">
  //After loading the page insert the title attribute.
  $(function(){
    $("select option").attr( "title", "" );
    $("select option").each(function(i){
      this.title = this.text;
    })
  });

  //Attach a tooltip to select elements
  $("select").tooltip({
   left: 25
  });
</script>

<!-- When moving the mouse over the below options -->
<select>
   <option>very long option text 1</option>
   <option>very long option text 2</option>
   <option>very long option text 3</option>
   <option>very long option text 4</option>
   <option>very long option text 5</option>
   <option>very long option text 6</option>
</select>

Answer 2

HTML：

<select id="sel">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

的javascript：

$(document).ready(function(event) {
    $('#sel').mouseenter(function(e) {
        this.title = $("#sel option:selected" ).text();
    });
});