我创建了一个虚构的订单表单，其中包含由 jQuery 提供支持的工具提示...当您将鼠标悬停在您可以选择的汤的标签上时，工具提示会显示自己并提供有关汤的一些信息（我从服务器中提取数据php 文件 - 将在问题结束时提供源代码）。我正在使用循环机制来偏移工具提示，这样当您向下查看其他汤的标签并将鼠标悬停在它们上方时，它们每次都会偏移特定的数量。
现在这就是问题所在......您可以将每个鼠标悬停一次，它工作正常，但如果您再次查看它们，工具提示会不断出现在页面下方，直到它们完全消失。我知道这与我的循环结构有关，但我不知道如何在这种情况下终止它并将偏移增量设置回原始值（所以如果你想再次将鼠标悬停在它们上面，工具提示会出现在相同的将鼠标悬停在它们上时的位置）。
我最近两周才开始学习 jQuery 并且一直在查看他们的库，它看起来很复杂，出于某种原因，我有时会将它与标准 Javascript 甚至 Java 和 PHP 混淆，所以如果问题最终变得微不足道，我深表歉意（无论如何，对于有经验的 jQuery 编码器）。
我已将表格上传到我的主机，因此你们都可以查看表格并亲自查看会发生什么，您可以在http://www.interkiwiwebdevelopers.com/code-examples/scarfiesoupshack/查看页面。当您进入该页面时，只需将鼠标悬停在每个汤的名称上，您就会看到如前所述的信息。正如我之前所说，第一次将鼠标悬停在每一个上时似乎工作正常，但在第二次和随后的每次悬停之后，它们只是在页面上越来越低，而不是返回到原来的位置。您可以查看除“soupsInfo.php”文件（在文件“scarfiesoupshack.js”中使用）之外的所有文件的源代码，如下所示：
<?php
/*
* soupsInfo.php: this php script uses a switch-case statement to echo out a string
* describing the soup, of whose "soup_id" is in the GET query string eg:
*
* If you hover over the "Pumpkin Soup" label (whose soup_id would be "pumpkin"),
* the text that would be echoed out (and displayed in the "hidden" div) would be
* "A delicious creamy pumpkin soup".
*
* Refer to line 24 in "scarfiesoupshack.js" to see where the GET
* query string is being created.
*/
if (isset($_POST['soup_id'])){
// get soup_id value
$soup_id = $_POST['soup_id'];
switch($soup_id){
case "pumpkin":
echo ("<p style=\"margin-top:0px;\">A delicious creamy pumpkin soup</p>");
break;
case "chicken";
echo ("<p style=\"margin-top:0px; opacity:1.0;\">A flavoursome chicken soup</p>");
break;
case "clam":
echo ("<p style=\"margin-top:0px;\">Fresh clam soup from the ocean</p>");
break;
case "harira":
echo ("<p style=\"margin-top:0px;\">Whats harira?</p>");
break;
default:
echo ("<p style=\"margin-top:0px;\">What is this soup?</p>");
}
}
?>
抱歉我对问题的解释如此密集，我不知道如何以紧凑的方式解释它......
提前致谢 ：）。