我的工具提示代码在应显示工具提示时在 IE 8 中显示“提示未定义”。答案

【问题标题】：My tool tip code is displaying "Tip is undefined" in IE 8 when it should be displaying the tool tip.我的工具提示代码在应显示工具提示时在 IE 8 中显示“提示未定义”。
【发布时间】：2011-10-19 04:01:01
【问题描述】：

当它应该显示工具提示时，我的工具提示代码在 IE 8 中显示“提示未定义”。以下代码适用于所有其他浏览器。

//这是我的代码

jQuery(".tiptrigger").hover(function(){
    tip = jQuery('#tool_content');
    tip.show(); //Show tooltip
}, function() {
    tip.hide(); //Hide tooltip
}).mousemove(function(e) {
    var mousex = e.pageX + 20; //Get X coodrinates
    var mousey = e.pageY + 20; //Get Y coordinates
    var tipWidth = tip.width(); //Find width of tooltip
    var tipHeight = tip.height(); //Find height of tooltip

    //Distance of element from the right edge of viewport
    var tipVisX = jQuery(window).width() - (mousex + tipWidth);
    //Distance of element from the bottom of viewport
    var tipVisY = jQuery(window).height() - (mousey + tipHeight);

    if ( tipVisX < 20 ) { //If tooltip exceeds the X coordinate of viewport
        mousex = e.pageX - tipWidth - 20;
    } if ( tipVisY < 20 ) { //If tooltip exceeds the Y coordinate of viewport
        mousey = e.pageY - tipHeight - 20;
    }
    tip.css({  top: mousey, left: mousex });
});




    <p class="tiptrigger">Sample Tool tip
        <div id="tool_content" class="tip" style="display: none;">
                    Welcome
        </div>
    </p>

【问题讨论】：

除了 IE 一切都很好...

标签： jquery jquery-plugins jquery-selectors

【解决方案1】：

按照你的例子，试试：

var tip = jQuery('#tool_content');

jQuery(".tiptrigger").hover(function(){
   tip.show(); //Show tooltip
   //rest of your code

【讨论】：

【解决方案2】：

看起来您正在使用tip 作为全局变量。试试这个

var tip = null;
jQuery(".tiptrigger").hover(function(){
    if(!tip)
      tip = jQuery('#tool_content');
    tip = jQuery('#tool_content');
    tip.show(); //Show tooltip
}, function() {
    if(!tip)
      tip = jQuery('#tool_content');
    tip.hide(); //Hide tooltip
}).mousemove(function(e) {
    if(!tip)
      tip = jQuery('#tool_content');
    var mousex = e.pageX + 20; //Get X coodrinates
    var mousey = e.pageY + 20; //Get Y coordinates
    var tipWidth = tip.width(); //Find width of tooltip
    var tipHeight = tip.height(); //Find height of tooltip

    //Distance of element from the right edge of viewport
    var tipVisX = jQuery(window).width() - (mousex + tipWidth);
    //Distance of element from the bottom of viewport
    var tipVisY = jQuery(window).height() - (mousey + tipHeight);

    if ( tipVisX < 20 ) { //If tooltip exceeds the X coordinate of viewport
        mousex = e.pageX - tipWidth - 20;
    } if ( tipVisY < 20 ) { //If tooltip exceeds the Y coordinate of viewport
        mousey = e.pageY - tipHeight - 20;
    }
    tip.css({  top: mousey, left: mousex });
});

【讨论】：