使用JavaScript+Html创建win8应用（二）

向我们的应用中添加JavaScript 的 Windows 库控件，首先我们接着上一个demo把一个评分控件添加进来

　　与 HTML 控件不同的是，适用于 JavaScript 的 Windows 库控件没有专用的标记元素：例如，你无法通过添加<rating /> 元素来创建 Rating 控件。若要添加适用于 JavaScript 的 Windows 库控件，可以创建 div 元素并使用 data-win-control 属性指定所需的控件类型。若要添加 Rating 控件，请将该属性设置为 "WinJS.UI.Rating"。

　　

上面代码就是我们的上一个demo中的，不熟悉的可以看看上一个例子

 

　　运行结果：

　　

 

　　当我们操作评分控件时不会有任何反应，接下来我们给它注册事件

　　打开default.js文件，添加如下代码段，rating控件有个change事件我们就注册这个事件

1 function ratingChanged(evenInfo)
2     {
3         var ratingOutPut = document.getElementById("ratingOutPut");
4         ratingOutPut.innerText = "您对回答做出了 "+evenInfo.detail.tentativeRating+"分 的评价";
5     }

　　怎么调用这个方法呢?

 1 app.onactivated = function (args) {
 2         if (args.detail.kind === activation.ActivationKind.launch) {
 3             if (args.detail.previousExecutionState !== activation.ApplicationExecutionState.terminated) {
 4                 // TODO: 此应用程序刚刚启动。在此处初始化
 5                 //您的应用程序。
 6             } else {
 7                 // TODO: 此应用程序已从挂起状态重新激活。
 8                 // 在此处恢复应用程序状态。
 9             }
　　　　　　　　      //就是在此处注册rating控件的change事件了
10             args.setPromise(WinJS.UI.processAll().then(function completed() {
11                 var ratingControlDiv = document.getElementById("ratingControlDiv");
12                 var ratingControl = ratingControlDiv.winControl;
13                 ratingControl.addEventListener("change", ratingChanged, false);
14             }));
15 
16             var helloButton = document.getElementById("btnHello");
17             helloButton.className = "buttonstyle";
18             helloButton.addEventListener("click", buttonClickHandler, false);
19         }
20     };

　　运行结果如下：

　　

 

　　这就是用html+JavaScript写的第一个win8应用，参考了微软提供的实例

　　本文来自小慧only的博客，原文地址：http://www.cnblogs.com/zhaohuionly/archive/2012/11/26/2788609.html