1

由于某种原因，我的 eventHandling 代码停止工作。我正在处理一些函数来处理 indexedDB 的东西，当我回到界面上工作时，我注意到 eventHandlers 只在应用程序创建时起作用，即使我没有对它们执行任何操作，它们也会消失。这是我的 default.js

(function () {
"use strict";

WinJS.Binding.optimizeBindingReferences = true;

var app = WinJS.Application;
var activation = Windows.ApplicationModel.Activation;
var _swAlarm;

app.onactivated = function (args) {
    if (args.detail.kind === activation.ActivationKind.launch) {
        if (args.detail.previousExecutionState !== activation.ApplicationExecutionState.terminated) {

        } else {

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

app.oncheckpoint = function (args) {

};

function testSelection(value) {
    console.log("from event listner "+value)
}

function getDomElements() {
    _swAlarm = document.getElementById("swAlarm");
}

function registerHandlers() {
    _swAlarm.addEventListener("onchange", console.log("ola"));
}


app.onready = function () {
    getDomElements();
    registerHandlers();
}

app.start();

这是我的 default.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>MyApp</title>

    <!-- WinJS references -->
    <link href="//Microsoft.WinJS.1.0/css/ui-dark.css" rel="stylesheet" />
    <script src="//Microsoft.WinJS.1.0/js/base.js"></script>
    <script src="//Microsoft.WinJS.1.0/js/ui.js"></script>

    <!-- my references -->
    <link href="/css/default.css" rel="stylesheet" />
    <script src="/js/default.js"></script>
    <script src="/js/database.js"></script>

    <!-- jquery references -->
    <script src="js/jquery-1.8.2-win8-1.0.js"></script>
    <script src="js/visualize.jQuery.js"></script>
    <script type="text/javascript"> jQuery.isUnsafe = true;</script>
    <link href="/css/default.css" rel="stylesheet" type="text/css">
</head>

<body>
    <div id="content">
        <div id="settings">
            <h2 id="lAlarm">Alarm</h2>
            <div id="swAlarm" data-win-control="WinJS.UI.ToggleSwitch" ></div>
            <input id="iMaxval" type="number">
            <input id="iMinval" type="number">
            <button id="bSave">Save</button>

        </div>

        <div id="graph">
            <h2 id="hGraph" class="graph">Graph</h2>
        </div>

        <div id="stats">
            <h2 id="hStats" class="stats">Stats</h2>
        </div>
    </div>
</body>
</html>
4

1 回答 1

2

当您运行此代码时：

_swAlarm.addEventListener("onchange", console.log("ola"));

你是：

  1. 跑步console.log("ola")
  2. 影响结果作为 _swAlarm 的事件 onchange 的回调。

这在很多层面上都是错误的。

  1. console.log("ola")不返回回调。我想我明白你的意思，正确的代码可能是：function() { console.log("ola"); }
  2. 使用时，addEventListener您必须使用带有事件面额的dom lexique 。在您的情况下，onchange需要改为change. 如果您必须直接在 html 中影响此事件，您确实必须使用onchange="console.log("ola");". 但不与addEventListener.

最终结果是：

_swAlarm.addEventListener("change", function() { console.log("ola"); }, false);

至于为什么它在应用程序创建上起作用，我认为这仅仅是因为console.log("ola")在事件影响时立即调用了应用程序创建，但是由于后来没有任何事件受到实际影响，所以你不会得到该onchange事件的任何结果。

附带说明一下，由于我猜您正在从“旧”语法（onchange ...等）迁移到addEventListenerapi，因此我将添加两种模式之间的重要区别：执行事件时老办法，this参考window。但是通过影响回调addEventListener使domElement自身（_swAlarm在您的情况下）成为this回调执行期间的目标。

于 2013-04-15T22:06:54.237 回答