var obj = event.currentTarget.winControl;document.getElementByIdを使ってDOMオブジェクトを取得してもいいのですが、ここでは引数で渡されるEventオブジェクトのcurrentTargetでイベントの発生したDOMを取得しています。そのwinControlでListViewオブジェクトを取得し、そのcurrentItemプロパティでインデックス番号が得られます。あとは、データ配列からその番号の連想配列を取り出して処理するだけです。
var item = obj.currentItem;
var n = item.index;
※リストが表示されない場合
AddBlockなどの広告ブロックツールがONになっているとリストなどが表示されない場合があります。これらのツールをOFFにしてみてください。
※完成したHTMLの<body>タグ <body> <h1 id="title">Sample Page</h1> <p id="msg">this is list sample page.</p> <div id="listTemp1" data-win-control="WinJS.Binding.Template"> <div style="width: 250px; height:250px; background-color:blue"> <div data-win-bind="textContent: title" style="font-size:18pt;"></div> <div data-win-bind="textContent: content" style="font-size:14pt;"></div> </div> </div> <div id="listview1" data-win-control="WinJS.UI.ListView" data-win-options="{itemDataSource:mydata.itemList.dataSource, itemTemplate:select('#listTemp1')}"> </div> </body> ※完成したスクリプト (function () { "use strict"; WinJS.Binding.optimizeBindingReferences = true; var app = WinJS.Application; var activation = Windows.ApplicationModel.Activation; // ListView用のデータ var dataArray = [ { title: "Windows", content: "WindowsはマイクロソフトのOSです。" }, { title: "Mac OS X", content: "Mac OS Xはアップルが提供するOSです。Macにのみ搭載されています。" }, { title: "Linux", content: "LinuxはオープンソースのOSです。標準搭載されるPCはまだ少数です。" }, { title: "Android", content: "AndroidはGoogleが開発するOSです。スマートフォンやタブレット他、多数の危機に用いられています。" }, { title: "iOS", content: "iOSはアップルのOSです。iPhone/iPadに搭載されています。" }, { title: "Chrome OS", content: "Chrome OSはGoogleによるOSです。Chromebookに搭載される他、オープンソースで配布されてもいます。" } ]; var dataList = new WinJS.Binding.List(dataArray); var members = { itemList: dataList }; WinJS.Namespace.define("mydata", members); app.onactivated = function (args) { if (args.detail.kind === activation.ActivationKind.launch) { if (args.detail.previousExecutionState !== activation. ApplicationExecutionState.terminated) {} else {} args.setPromise(WinJS.UI.processAll().then(function completed() { var list = document.getElementById("listview1"); list.addEventListener("click", list1Action); })); } } app.oncheckpoint = function (args) {}; // ※追加した関数 function list1Action(event) { var obj = event.currentTarget.winControl; var item = obj.currentItem; var n = item.index; var h = document.getElementById("title"); h.textContent = dataArray[n].title; var p = document.getElementById("msg"); p.innerHTML = dataArray[n].content; } app.start(); })();
<< 前へ | 次へ >> |