Javascript 使JQuery工具提示在每次鼠标移动时检索新值

当我开发一个应用程序时，它使用了一个工具提示，当用户移动鼠标时，它会显示一个不同的值

用户将鼠标移到表格单元格上，然后应用程序生成一个数字，光标在单元格中移动得越右，值增加得越高

我创建了一个运行的工具提示，当光标滑过单元格时，它确实显示了正确的值。但是，当我移动鼠标时，它不会显示新值，而只显示旧值。我需要知道如何使它在每次鼠标移动或变量值更改时更新，有什么办法解决这个问题吗

<table>
      <tr id="mon_Section">
          <td id="day_Title">Monday</td>
          <td id="mon_Row"></td>
      </tr>
</table>

功能如下：

$(document).ready(function()
{
    $("#mon_Row").mousemove(calculate_Time);
}); 

<script type="text/javascript">
var mon_Pos = 0;
var hour = 0;
var minute = 0;
var orig = 0;
var myxpos = 0;

function calculate_Time (event)
{
myxpos = event.pageX;
myxpos = myxpos-194;

if(myxpos<60)
{
    orig = myxpos;
    $('#mon_Row').attr("title", orig);
}
if (myxpos>=60 && myxpos<120)
{
    orig=myxpos;
    $('#mon_Row').attr("title", orig);
}
if (myxpos>=120 && myxpos<180)
{
    orig=myxpos;
    $('#mon_Row').attr("title", orig);

---

我知道正在为“单元格标题”属性指定一个新值，因为它将显示在浏览器将显示的标准小工具提示中。JQuery工具提示不会获取新值并显示它，只会在调用时显示变量的初始值

我对你的代码不是很清楚，所以这只是一个很长的问题。首先尝试运行代码，以便在出现引用问题时更容易解析：

$(document).ready(function() {

    $("#mon_Row").mousemove(function() {

        calculate_Time() ; 
        $(this).qtip(
            //
        ) ;

    );

});

据我所知，您希望将元素的title属性设置为position，然后使用

qtip（）

函数读取并显示其值。这是不必要的：如果让

计算时间（）

返回一个值

function calculate_Time (event) {

    var orig ;
    //conditions setting orig to myxpos 
    return orig ;

}

您可以将其保存到变量

var myOrig=calculate_Time（）

，然后将其传递给工具提示函数

qtip（myOrig）

，或者将函数本身的调用作为参数传递给函数本身

qtip（calculate_Time（））。这可能更易于维护和调试

Hth
如果jQuery不能完成您想要的任务，请跳过jQuery并在原始JavaScript中完成，下面是我为工具提示所做的：

<script type="text/javascript">
function hover(intext,e){
    if(!intext){return}
    document.getElementById("hoverdiv").innerHTML=intext
    document.getElementById("hoverdiv").style.display=""
    var x=0
    var y=0
    if(e.pageY>-1){
        x=e.pageX
        y=e.pageY
    }
    else{
        x=e.clientX
        y=e.clientY
        if(document.documentElement.scrollTop>-1){
            x+=document.documentElement.scrollLeft
            y+=document.documentElement.scrollTop
        }
        else if(document.body.scrollTop>-1){
            x+=document.body.scrollLeft
            y+=document.body.scrollTop
        }
    }
    document.getElementById("hoverdiv").style.left=(x+24)+"px"
    document.getElementById("hoverdiv").style.top=(y-24)+"px"
}
function hoverout(){
    document.getElementById("hoverdiv").style.display="none"
}
</script>
<div id="hoverdiv" style="display:none;position:absolute;background-color:#eef;border:1px solid black;padding:3px 6px;width:180px;"></div>


函数悬停（intext，e）{
如果（！intext）{return}
document.getElementById（“hoverdiv”）.innerHTML=intext
document.getElementById（“hoverdiv”）.style.display=“”
变量x=0
变量y=0
如果（e.pageY>-1）{
x=e.pageX
y=e.pageY
}
否则{
x=e.clientX
y=e.clientY
if（document.documentElement.scrollTop>-1）{
x+=document.documentElement.scrollLeft
y+=document.documentElement.scrollTop
}
else if（document.body.scrollTop>-1）{
x+=document.body.scrollLeft
y+=document.body.scrollTop
}
}
document.getElementById（“hoverdiv”）.style.left=（x+24）+“px”
document.getElementById（“hoverdiv”）.style.top=（y-24）+“px”
}
函数hoverout（）{
document.getElementById（“hoverdiv”）.style.display=“无”
}

将其与onMoseMove和onmouseout配对，如下所示：

<a onmouseout='hoverout()' onmousemove='hover("Tooltip",event)' href='#'>Hover</a>



<a onmouseout='hoverout()' onmousemove='hover("Tooltip",event)' href='#'>Hover</a>