2

在我的 home.html 中，我有：

<a href="/pages/page2/page2.html">Go to page2</a>

由 home.js 处理：

WinJS.Utilities.query("a").listen("click", linkClickEventHandler, false);

和 linkClickEventHandler 定义：

function linkClickEventHandler(eventInfo)
{
   eventInfo.preventDefault();
   var link = eventInfo.target;
   WinJS.Navigation.navigate(link.href);
}

如您所见，我重写了<a>使用页面控件导航而不是普通 HTML 导航的行为。

单击“转到 page2”时，它成功地将页面控件从 home.html 更改为 page2.html

现在，如果我想在<a>标签内使用图像而不是文本“Go to page2”，该怎么办：

<a href="/pages/page2/page2.html"><img src="page2.png" /></a>

这似乎不起作用。我已经加载并显示了图像，但是当我单击它时，它似乎尝试以文本格式显示图像，因为页面控件更改为一些充满未知（方形）字符的垃圾文本，这些字符以 'PNG. .. PHOTOSHOP...”（我使用 Photoshop 创建图像）

我也尝试添加：

WinJS.Utilities.query("img").listen("click", linkClickEventHandler, false);

但它什么也没做

4

1 回答 1

4

用这个：

var link = eventInfo.currentTarget;

... 反而。eventInfo.currentTarget看，和eventInfo.target（引用文档）之间有一个微妙但重要的区别：

该target属性返回最初接收到事件的元素。但是，该currentTarget属性返回在捕获和冒泡阶段正在处理事件处理程序的元素。

该错误是由eventInfo.target图像元素引起的，而不是链接元素。）看，从技术上讲，click事件首先发生在其中<img src... />；最终它到达了外部<a href="...">元素（所谓的bubbling），但它的原始目标（= eventInfo.target）仍然是一样的！因此，您的脚本实际上会导航到src图像属性中指定的 URL（作为其href属性值）。

于 2012-10-16T14:02:39.773 回答