1

我对 Jquery 很陌生，我在使用 .load(); 时遇到了麻烦。功能。我正在为一家餐馆建立一个网站，当用户将鼠标悬停在菜单上的项目（menuitem 类）上时，我想从我正在使用的 HTML 文件 menusrc.html 中将适当的数据加载到 ID 为 iteminfo 的 div 中.

通过阅读 API，我了解到您可以使用 .load(); 函数引入外部 HTML 并使用第二个参数指定要加载的内容的 ID。我还是个新手，所以在执行诸如此类的更复杂功能时，我不确定语法是否正确。

这是相关的HTML

 <li id="a1" class="menuitem"><span class="num">A1: </span>Gỏi cuốn <em>3.95</em></li>
 <div id="iteminfo">   </div>

和我的jQuery

$(".menuitem").hover(
function () {
$("#iteminfo").load("menusrc.html #" + this.id);
},
function () {
$("#iteminfo").empty();
});

外部 html 文件位于同一目录中，出于测试目的看起来像这样

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<div id="a1">THIS IS THE INFO FOR A1</div>
</body>
</html>

在我的脑海中，这个函数应该是这样工作的：当鼠标进入一个类 menuItem 的项目时，将与 menuItem 具有相同 ID 的 HTML 加载到 ID 为 itemInfo 的 div 中。当鼠标离开 menuItem 时，它应该清空 div。

也许我使用 .hover 错误或应该使用 .mouseenter 或其他东西，但我根本无法让 .load 工作，所以我认为我的错误可能就在那里。

在此先感谢您的帮助！！

4

1 回答 1

1

您需要#在加载函数中的 id 之前加上一个额外的括号。删除那些。

尝试：

$("#iteminfo").load("menusrc.html #" + this.id);

于 2013-03-09T18:12:36.617 回答