在开发Windows应用程序时,我正在使用WinJS。我遇到的错误是下面代码(home.js)中的“home.js”事件侦听器没有触发。就好像代码不存在一样。为了解决这个问题,我尝试使用一个单独的函数代码块和一个单独的行来设置事件列表器(例如,function handler(event) {...} lw.addEventListener("itemInvoked", handler); )。我甚至尝试在内联中这样做,例如:lw.addEventListener("itemInvoked", function(event) {...});。然而,这并没有什么区别。以下是我的代码:
basketball.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>groupedItemsPage</title>
<!-- WinJS references -->
<script src="//Microsoft.Phone.WinJS.2.1/js/base.js"></script>
<script src="//Microsoft.Phone.WinJS.2.1/js/ui.js"></script>
<script src="/pages/basketball/basketball.js"></script>
</head>
<body>
<div class="headertemplate" data-win-control="WinJS.Binding.Template">
<span class="group-header win-type-x-large win-type-interactive" role="link" tabindex="-1">
<span class="group-title win-type-ellipsis" data-win-bind="textContent: title"></span>
<span class="group-chevron"></span>
</span>
</div>
<div class="itemtemplate" data-win-control="WinJS.Binding.Template">
<div class="item">
<img id="image" class="item-image" src="#" data-win-bind="src: backgroundImage; alt: title" />
<div id="info" class="item-overlay">
<h4 id="title" class="item-title shadow" data-win-bind="textContent: title"></h4>
<h6 id="subtitle" class="item-subtitle win-type-ellipsis shadow" data-win-bind="textContent: subtitle"></h6>
</div>
</div>
</div>
<div class="fragment groupeditemspage">
<header aria-label="Header content" role="banner">
<button id="backButton" data-win-control="WinJS.UI.BackButton"></button>
<h1 class="titlearea win-type-ellipsis">
<span class="pagetitle">Basketball Today</span>
</h1>
</header>
<section class="content" aria-label="Main content" role="main" id="content">
<div id="item" aria-label="List of groups" data-win-control="WinJS.UI.ListView" data-win-options="{
layout: {type: WinJS.UI.GridLayout, groupHeaderPosition: 'top'},
selectionMode: 'none',
currentItem: {type: WinJS.UI.ObjectType.item, index: 0, hasFocus: true},
groupDataSource: Data.groups.dataSource,
groupHeaderTemplate: select('.headertemplate'),
itemDataSource: Data.items.dataSource,
itemTemplate: select('.itemtemplate'),
ongroupheaderinvoked: select('.pagecontrol').winControl.groupHeaderInvoked,
oniteminvoked: handler,
layout: {type: WinJS.UI.GridLayout, orientation: WinJS.UI.Orientation.vertical}
}">
</div>
</section>
</div>
</body>
</html>basketball.js
(function () {
"use strict";
WinJS.UI.Pages.define("/pages/basketball/basketball.html", {
ready: function (element, options) {
var lw = document.getElementById("item").winControl;
lw.addEventListener("iteminvoked", function (eventInfo) {
console.log("hi");
eventInfo.detail.itemPromise.done(function itemInvoked(item) {
WinJS.Navigation.navigate("/pages/article/article.html", { newsItem: item.data });
});
});
},
unload: function () { },
updateLayout: function (element) { }
});
})();值得注意的是,addEventListener的整个代码块似乎不起作用。我试着在页面导航之前添加console.log("hi");,以确定是否只是页面导航代码不起作用,但结果是控制台也没有记录"hi“,这意味着整个事件侦听器无法工作。
谢谢你的帮助。我对WinJS并不完全熟悉,因此我犯了一个错误(这个错误可能是一个小而愚蠢的错误)。
发布于 2014-06-07 04:01:47
在调用WinJS.UI.Pages.define时,第一个参数是页面ID,它必须与您导航到的HTML的名称相匹配。在您的代码中,您有/pages/篮球/basketball. have,它与home.html不匹配。
因此,home.html被加载得很好,但是页面控件的ready没有执行,因为您已经为basketball.html定义了它。因此,只需确保第一个字符串arg与它存在的Pages.define文件相匹配,即“/page/home/home. HTML”等。
https://stackoverflow.com/questions/24093401
复制相似问题