問題描述
無論是使用純 HTML 還是 jQuery 輔助 JavaScript,如何在單個 <option>
元素上顯示工具提示以幫助決策過程(沒有足夠的空間容納不同類型的控制和一些幫助將需要).
Either using plain HTML or jQuery assisted JavaScript, how do you display tooltips on individual <option>
elements to aid the decision process (there is not enough room for a different kind of control and some help will be needed).
這可以通過插件或類似的方式完成嗎?
Can this be done though a plug-in or similar?
我嘗試了幾個用于 jQuery 的工具提示插件,但都沒有成功(包括一個叫做 Tooltip 的插件).
I have tried a few tooltip plugins for jQuery with no success (including the one called Tooltip).
這個解決方案應該:
- 在 IE、WebKit 和 Gecko 中工作;
- 利用標準
<select>
包裝的<option>
元素.
- work in IE, WebKit as well as Gecko;
- utilizing standard
<select>
wrapped<option>
elements.
因此,如果解決方案想要使用其他標簽,它應該將這些元素動態轉換為所需的內容(并且不要期望初始標記有任何不同).
So if the solution wants to use other tags it should convert those elements into what it needs dynamically (and not expect the initial mark-up to be any different).
可以在 here 找到此代碼,它位于 SafeSurf 部分下,我想在其中顯示關于選項含義的選項翻轉的一些幫助.目前只能事后"顯示.并且為用戶提供一些前期幫助將是有益的.
The code for this can be found here, it is under the SafeSurf section, where I want to display some help on rollover of the options as to the meaning of the choices. At present it can only be displayed "after the fact" and some upfront help for the user would be beneficial.
意識到這并不容易,并且可能需要創建一些東西 - 因此賞金將授予最完整的解決方案或使我最接近我可以創建的解決方案的特定鉤子.強>
推薦答案
似乎在被問到這個問題后的 2 年里,其他瀏覽器已經趕上了(至少在 Windows 上……不確定其他瀏覽器).您可以在選項標簽上設置標題"屬性:
It seems in the 2 years since this was asked, the other browsers have caught up (at least on Windows... not sure about others). You can set a "title" attribute on the option tag:
<option value="" title="Tooltip">一些選項</option>
這適用于 Windows 7 上的 Chrome 20、IE 9(及其 8 和 7 模式)、Firefox 3.6、RockMelt 16(基于 Chromium)
This worked in Chrome 20, IE 9 (and its 8 & 7 modes), Firefox 3.6, RockMelt 16 (Chromium based) all on Windows 7
這篇關于如何在 HTML“選項"上顯示工具提示?標簽?的文章就介紹到這了,希望我們推薦的答案對大家有所幫助,也希望大家多多支持html5模板網!