使用圖像作爲在javascript超級鏈接爲Windows 8地鐵

在我home.html的我：使用圖像作爲在javascript超級鏈接爲Windows 8地鐵

<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>的行爲來使用Page Control navig而不是普通的HTML導航。

當點擊「進入第2頁」，它成功地改變從home.html的頁面控件page2.html

現在，如果不是隻是文本「轉到第2頁：」我想用裏面的圖像<a>標籤：

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

這似乎並沒有工作。我已經得到了加載和顯示圖像，但是當我點擊它時，似乎嘗試以文本格式顯示圖像，因爲頁面控件更改爲一些包含以'PNG'開頭的未知（方形）字符的垃圾文本。 .. PHOTOSHOP ...」（我用Photoshop中創建映像）

我也嘗試添加：

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

，但它不會做任何事情

來源

2012-10-16 Arvin

將'var link = eventInfo.target'替換爲'var link = eventInfo.currentTarget;'。它有幫助嗎？） – raina77ow

美麗。謝謝拉尼。你介意解釋一下有什麼不同嗎？目標引用的是img標籤而不是標籤什麼的？ – Arvin

@ raina77ow做出答案！ – epascarello

使用此：

var link = eventInfo.currentTarget;

...取而代之。見，有（報價the doc）eventInfo.currentTarget和eventInfo.target之間的微妙但重要的區別：

的target屬性返回最初收到事件的元素。但是，currentTarget屬性返回在捕獲期間處理事件處理程序的元素，以及在冒泡階段返回處理元素的。

該錯誤是由eventInfo.target作爲一個圖像元素不是鏈接之一引起的，和。）技術上看，click事件首先發生在<img src... />之內;最終它到達了外部的<a href="...">元素（所謂的bubbling），但其原始目標（= eventInfo.target）仍然相同！因此，您的腳本實際導航到圖像的src屬性中指定的URL（作爲其href屬性值）。

來源

2012-10-16 14:02:39 raina77ow

好的，因爲爲標籤調用函數linkClickEventHandler，則currentTarget是標籤。但事件已被要求標籤，這就是爲什麼目標是？ – Arvin

@阿文正好。）請參閱該事件處理程序已分配給''元素，因此它在_current_目標處於''時處理事件。 – raina77ow

使用圖像作爲在javascript超級鏈接爲Windows 8地鐵

回答

相關問題