windows8中的事件处理

来源：互联网发布：照片归类软件编辑：程序博客网时间：2024/05/16 04:14

这是javascript创建的空白应用程序中的默认js文件(default.js)内容：

(function () {    "use strict";    WinJS.Binding.optimizeBindingReferences = true;    var app = WinJS.Application;    var activation = Windows.ApplicationModel.Activation;    app.onactivated = function (args) {        if (args.detail.kind === activation.ActivationKind.launch) {            if (args.detail.previousExecutionState !== activation.ApplicationExecutionState.terminated) {                // TODO: 此应用程序刚刚启动。在此处初始化                //您的应用程序。            } else {                // TODO: 此应用程序已从挂起状态重新激活。                // 在此处恢复应用程序状态。            }            args.setPromise(WinJS.UI.processAll());        }    };    app.oncheckpoint = function (args) {        // TODO: 即将挂起此应用程序。在此处保存        //需要在挂起中保留的任何状态。您可以使用        // WinJS.Application.sessionState 对象，该对象将在        //挂起中自动保存和恢复。如果您需要在        //挂起应用程序之前完成异步操作，请调用        // args.setPromise()。    };    app.start();})();

这段代码中的"use strict"代表的是开启严格模式，严格模式为代码提供了额外的错误检查。

有两个事件，代表的是应用的生命周期，每个应用都有它的应用生命周期：

onactivated事件表示的正在运行或者激活，这个事件里面是用来注册我们的事件处理程序，就是把初始化的内容和添加事件都写在这里面。

oncheckpoint事件表示的已挂起，这个事件里面就是处理即将挂起应用时会调用的程序。

处理函数写在default.js 中的 app.oncheckpoint 事件处理程序之后、对 app.start 的调用之前。

下面通过一个小例子来学习如何进行事件处理：

我想要实现的效果很简单，就是在文本输入框中输入我的姓名，当我点击按钮的时候，把我的名字显示出来。

首先是html部分的内容：

在default.html页面的body部分加：

<body>    请输入您的姓名：<input type="text" id="userName" /><input type="button" value="按钮" id="btn" />    <div id="con">这里显示您的姓名</div></body>

现在就是给应用添加事件了，按照应用生命周期的原则：我们把事件绑定写在onactivated里面，这里再说一下，

args.setPromise(WinJS.UI.processAll());

这行代码的意思是初始化应用中的所有控件，我们现在没用到控件，不删留着它就行，添加事件后的代码：

app.onactivated = function (args) {        if (args.detail.kind === activation.ActivationKind.launch) {            if (args.detail.previousExecutionState !== activation.ApplicationExecutionState.terminated) {                // TODO: 此应用程序刚刚启动。在此处初始化                //您的应用程序。            } else {                // TODO: 此应用程序已从挂起状态重新激活。                // 在此处恢复应用程序状态。            }            args.setPromise(WinJS.UI.processAll());            var btn = document.getElementById("btn");//获取按钮            btn.addEventListener("click", btnHendler, false);//为按钮添加处理函数        }};

在onactivated事件里面为按钮注册事件后，就是写处理函数了，按照应用生命周期原则，应该把处理函数写在app.oncheckpoint 事件处理程序之后、对 app.start 的调用之前：

function btnHendler() {//事件处理函数        var userName = document.getElementById("userName").value;//获取文本框里的文本        document.getElementById("con").innerText = userName;//把文本框里的内容添加到con(名字显示区域)里面}

最后贴出修改后的完整default.js文件：

(function () {    "use strict";    WinJS.Binding.optimizeBindingReferences = true;    var app = WinJS.Application;    var activation = Windows.ApplicationModel.Activation;    app.onactivated = function (args) {        if (args.detail.kind === activation.ActivationKind.launch) {            if (args.detail.previousExecutionState !== activation.ApplicationExecutionState.terminated) {                // TODO: 此应用程序刚刚启动。在此处初始化                //您的应用程序。            } else {                // TODO: 此应用程序已从挂起状态重新激活。                // 在此处恢复应用程序状态。            }            args.setPromise(WinJS.UI.processAll());            var btn = document.getElementById("btn");//获取按钮            btn.addEventListener("click", btnHendler, false);//为按钮添加处理函数        }    };    app.oncheckpoint = function (args) {        // TODO: 即将挂起此应用程序。在此处保存        //需要在挂起中保留的任何状态。您可以使用        // WinJS.Application.sessionState 对象，该对象将在        //挂起中自动保存和恢复。如果您需要在        //挂起应用程序之前完成异步操作，请调用        // args.setPromise()。    };    function btnHendler() {//事件处理函数        var userName = document.getElementById("userName").value;//获取文本框里的文本        document.getElementById("con").innerText = userName;//把文本框里的内容添加到con(名字显示区域)里面    }    app.start();})();

到这里对事件处理的介绍就结束了，在用javascript开发windows8 metro应用中，代码解析因为用的是ie10的内核，所以ie10的事件在应用开发也是一样可以使用的，在ie10中新增加了很多的事件和手势，大家如果有兴趣可以查阅我的另一篇关于ie10事件的文章。

阅读全文

0 0