立即提交设置Windows 8应用程序



我正在尝试为Windows 8制作一个具有两个输入框和一个按钮的测试应用程序(我们称之为"计算"按钮)。当用户按下按钮时,他会得到一个结果。他可以通过选择要在设置浮出控件中使用的单位,以公制或英制单位输入详细信息。现在我要做的是立即提交更改。例如,当用户选择英制单位时,输入框和结果会自动更改为英制。现在,当我将单位从公制更改为英制时,我必须再次按"计算"按钮才能以英制查看结果。我该怎么做?

下面是我的一些代码。在默认的.js文件中,我创建了一个按钮处理程序:

var test = document.getElementById("button");
test.addEventListener("click", doDemo, false);

在完成所有计算的主.js文件中,它看起来像这样:

function doDemo(eventInfo) {
    var applicationData = Windows.Storage.ApplicationData.current;
    var roamingSettings = applicationData.roamingSettings;
    if (roamingSettings.values["cmorft"] == 'imperial') {
        var greetingString3 = "Imperial";
        document.getElementById("units").innerText = greetingString3;
    } else {
        var greetingString4 = "metric";
        document.getElementById("units").innerText = greetingString4;
    }

我使用了以下内容来保存用户的选择:

var applicationData = Windows.Storage.ApplicationData.current;
var roamingSettings = applicationData.roamingSettings;
    WinJS.UI.Pages.define("/html/settings.html", {
        // This function is called whenever a user navigates to this page. It
        // populates the page elements with the app's data.
        ready: function (element, options) {
            var imperialRadio = document.getElementById("imperial"),
                metricRadio = document.getElementById("metric");
            // Set settings to existing values
            if (roamingSettings.values.size > 0) {
                if (roamingSettings.values["cmorft"]) {
                    setMIValue();
                }
            }
            // Wire up on change events for settings controls
            imperialRadio.onchange = function () {
                roamingSettings.values["cmorft"] = getMIValue();
            };
            metricRadio.onchange = function () {
                roamingSettings.values["cmorft"] = getMIValue();
            };
        },
        unload: function () {
            // Respond to navigations away from this page.
        },
        updateLayout: function (element, viewState, lastViewState) {
            // Respond to changes in viewState.
        }

如果我理解正确,您只需要在更改单位时设置 HTML 元素的 innerText 属性,而不仅仅是在单击按钮时设置。在您的演示中,它可以像从单选按钮的 onchange 处理程序中调用 doDemo 一样简单,因为这将读取更新的设置并设置文本。

最新更新