Hiển thị chú giải công cụ jquery ui trên một tùy chọn chọn

Question

Thông qua JQueryUI, có cách nào để có chú giải công cụ (không phải là mặc định), hiển thị tùy chọn riêng lẻ của tùy chọn/thả xuống không?

Tôi có một danh hiệu không làm việc Sample

Tôi không yêu cầu cho các tùy chọn lựa chọn để hiển thị nó, mà đang xảy ra trong mẫu.

Vấn đề của tôi đôi khi là chú giải công cụ, tùy thuộc vào trình duyệt, hiển thị phía sau danh sách thả xuống khi tôi di chuột qua tùy chọn. Điều này thường xảy ra trong Firefox hoặc IE10.

Hoặc là nó hoặc không sử dụng chú giải công cụ JQueryUI. Chrome chỉ sử dụng tooltip mặc định

Dưới đây là mẫu mã của tôi nếu bạn không muốn nhìn vào JSFiddle:

$(function() { 
    $(document).tooltip({items:"select,option,.optionClass",position:{ my: "left top", at: "left bottom"} 
    }); 
}); 

Answer 1

Là một lựa chọn bạn không thể xác định vị trí các tooltip vừa phải của danh sách thả xuống? Thêm lề trái: 70px vào lớp .ui-tooltip trong ví dụ của bạn - Nó không phải là yêu cầu của bạn nhưng có thể là một công việc xung quanh.

Answer 2

jQuery UI tooltip làm việc cho <option> chỉ nếu thuộc tính size được thiết lập cho <select>

Chỉ khi thuộc tính kích thước được thiết lập trên các yếu tố lựa chọn, thực hiện các sự kiện cần thiết cho tooltip để làm việc thực sự lửa. - source

Dưới đây là một updated example

Answer 3

tôi hiện không thể vượt qua vấn đề này bản thân mình, nhưng tôi đã tìm ra một cách ít nhất là có thể sử dụng widget tooltip với một lựa chọn.

Hãy tưởng tượng rằng bạn có <div id="SelectFieldDiv"> đang giữ . Bạn có thể nhận <div id="SelectFieldDiv"> có tooltip theo kiểu, di chuột qua văn bản:

$(document).ready(function() { 
     $(document).tooltip(); 

     $('#SelectField').change(function(e) { 
       $('#SelectFieldDiv').prop('title', $('#SelectField').find(':selected').prop('title')); 
     }); 

     $('#SelectField').change(); 
}); 

Thật không may, câu trả lời cho câu hỏi khác dường như là: Không, bạn không thể sử dụng tooltip với trên một số nhân, trừ khi bạn đặt thuộc tính kích thước cho một cái gì đó lớn hơn 1 (trong đó, rất ít lựa chọn là như thế).

Tôi đã thử nghiệm với các phiên bản cập nhật nhất: jQuery v. 3.2.1; jQuery-UI phiên bản 1.12.1.