鉴于此HTML(代码段):
<input type="text" name="sch_alert" value="[email protected]" size="40"
maxlength="45" onchange="return valString(this.form.sch_alert, 0, 45, 'Invalid entry
for this field')" title="" id="idsch_alert"
placeholder="Your email address"><input type="text" name="sch_sms" value="44788xxxxxxx"
size="20" maxlength="14" title="" id="idsch_sms" placeholder="Your mobile number"><br>
<label class="companyform" for="idsch_all">All Campaigns?</label>
<select name="sch_all" title="Select Yes to extract/alert for replies on all
campaigns, otherwise select No and select specific campaigns below." id="idsch_all">
<option value="Y">Yes</option>
<option value="N">No</option>
</select>
以下javascript作品:
new Opentip($('idsch_alert'), 'Email to receive reply data alert', 'Alert email', {style: 'myStyle'});
new Opentip($('idsch_sms'), 'Mobile phone number', 'Alert mobile', {style: 'myStyle'});
但这不是:
new Opentip($('idsch_all'), 'Extract all data?', 'Extract', {style: 'myStyle'});
最后一个来自opentip-prototype.js的错误:
if (this.triggerElement.length > 1) {
throw new Error("You can't call Opentip on multiple elements.");
}
我猜问题是元素长度取决于选项的数量,因为我可以为每个选项分配一个唯一的ID,然后为每个选项创建一个Opentip(尽管存在定位错误,我可以通过以下方式解决此问题)分配其他目标)。
我正在使用opentip-prototype.js v2.4.6(opentip.org)
最佳答案
作为10的入门者,如果您希望每个选项使用不同的工具提示,则可以为IE和chrome添加类似内容:
<select multiple="multiple" size="3">
<option value="A" data-ot="AAA"> Hello</option>
<option value="B" data-ot="BBB">GoodBye</option>
<option value="C">GoodByeC</option>
<option value="D">GoodByeD</option>
<option value="E">GoodByeE</option>
<option value="F" data-ot="FFF">GoodByeF</option>
</select>
$(document).ready(
function (event) {
var select1 = $('SELECT option');
if (select1.length == 0) return;
select1 = select1[0];
var optionToolTip = new Opentip($(select1), '', '', {});
$('select').mousemove(function (e) {
var mouseY = e.offsetY;
//var o = document.elementFromPoint(e.PageX, e.pageY);
var selectHeight = this.scrollHeight;
var optionHeight = selectHeight / this.options.length;
var Y2 = mouseY + this.scrollTop;
var optionIndex = Math.floor(Y2 / optionHeight);
if (optionIndex < 0 || optionIndex >= this.options.length) {
optionToolTip.prepareToHide();
return;
}
var optionHovered = this.options[optionIndex];
//return new Opentip(this, content, title, options);
var content = optionToolTip.adapter.data(optionHovered, "ot");
if ((content == null)||(content == ''))
optionToolTip.prepareToHide();
else
{
optionToolTip.setContent(content);
optionToolTip.prepareToShow();
}
});
$('select').mouseout(function (e) {
optionToolTip.prepareToHide();
});
});