0

我正在开发 Windows 10 商店应用程序 Javascript/Html，并且由于应用程序中有 Microsoft EDGE 作为浏览器，因此内联脚本不再起作用。如果我将代码放在外部文件中，页面会加载，但点击事件都不起作用。有什么解决方案。onclick 属性不起作用的小例子。

代码

默认.html 7 默认.js

// For an introduction to the Blank template, see the following documentation:
// http://go.microsoft.com/fwlink/?LinkId=232509

function gored() {
    document.body.style.backgroundColor = red;
}


(function () {
    "use strict";

    WinJS.Binding.optimizeBindingReferences = true;

    var app = WinJS.Application;
    var activation = Windows.ApplicationModel.Activation;
    var isFromBackground = false;
    app.onactivated = function (args) {

        var localSettings = Windows.Storage.ApplicationData.current.localSettings;
        if (args.detail.kind === activation.ActivationKind.launch) {
            if (args.detail.previousExecutionState !== activation.ApplicationExecutionState.terminated) {
                
                // TODO: This application has been newly launched. Initialize
                // your application here.
            } else {
                // TODO: This application has been reactivated from suspension.
                // Restore application state here.
            }
            args.setPromise(WinJS.UI.processAll());
        }
    };

    app.oncheckpoint = function (args) {
        // TODO: This application is about to be suspended. Save any state
        // that needs to persist across suspensions here. You might use the
        // WinJS.Application.sessionState object, which is automatically
        // saved and restored across suspension. If you need to complete an
        // asynchronous operation before your application is suspended, call
        // args.setPromise().
        isFromBackground = true;
    };

    app.start();
})();
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>App1</title>

    <!-- WinJS references -->
    <!-- To get the latest version of WinJS, go to: http://go.microsoft.com/fwlink/?LinkId=533245 -->
    <link href="WinJS/css/ui-dark.css" rel="stylesheet" />
    <script src="WinJS/js/WinJS.js"></script>

    <!-- App1 references -->
    <link href="/css/default.css" rel="stylesheet" />
    <script src="/js/default.js"></script>
</head>
<body>

    <p>Content goes here</p>
    <button onclick="gored()"> Click Me</button>
</body>
</html>

4

2 回答 2

2

我在一篇博文中详细介绍了这一点。

Windows HTML5 应用程序具有严格的安全设置，尤其是在运行时通过 JavaScript 注入代码时。我之前也遇到过这个问题。

您可以将用于注入 Javascript 的函数与另一个函数MSApp.execUnsafeLocalFunction()一起包装。

尝试动态插入 div 时，Windows 8 会引发错误。具体来说，是在尝试使用以下内容时：

div.innerHTML = "A string of some stuff"

HTML1701: Unable to add dynamic content ' a' A script attempted to inject dynamic content, or elements previously modified dynamically, that might be unsafe. For example, using the innerHTML property to add script or malformed HTML will generate this exception. Use the toStaticHTML method to filter dynamic content, or explicitly create elements and attributes with a method such as createElement. For more information, see http://go.microsoft.com/fwlink/?LinkID=

原因：

所有这些问题背后的原因都是一样的，所以为了简洁起见，我在这里只陈述一次。`微软担心该字符串可能会在某处被截获，恶意内容可能会添加到您的字符串的值中。

解决方法：

这种方法的最大问题是您正在尝试使用 innerHtml。相反，请使用 .append。

但是，如果您只是尝试传入一个字符串，那仍然行不通。您需要做的是将您的字符串设置为一个变量，然后传入该变量。如果您不创建对象（即，将字符串设置为变量），那么这将不起作用。如果你只是尝试使用一个字符串，那么你只会看到 div 应该在哪里的文本。

这是一个单行示例：

$panel.append('<'img src="' + item.thumbImageUrl +'" >');

如果您尝试将其传入，Windows 8 将抛出上面看到的错误。即使我将它包装在 MSApp.execUnsafeLocalFunction() 中，我仍然会看到一个错误。

解决方法如下：

var appendString = '<'img src="' + item.thumbImageUrl '" >';
$panel.append(appendString);

因为我现在正在获取该字符串并将其设置为变量（从而将其转换为对象），Windows 8 将允许我传入该对象并创建动态内容。

即使这样，它偶尔也会抛出上面的错误。但是，如果您将该对象包装在 MSApp.execUnsafeLocalFunction() 中，那么您就很清楚了。WinJS 提供了一个函数来包装你自己的函数，它允许你基本上说“我对这个函数负责，我向你保证它是安全的”。该函数称为：MSApp.execUnsafeLocalFunction()。

所以最终的解决方案是这样的：

var appendString = '<'img src="' + item.thumbImageUrl '" >';
 MSApp.execUnsafeLocalFunction(function() {
     $panel.append(appendString); 
});

您可以在此处阅读有关此问题的更多信息。

延伸阅读：

来自 MSDN 的 execUnsafeLocalFunction

TutsPlus jQuery 和 Win8 教程

于 2015-07-07T21:47:18.390 回答
0

我遇到了类似的问题，发现在标题中读取的脚本不起作用，但是当我将它移到正文时，它确实：

适用于大多数但不是所有带有“边缘”的页面。适用于所有其他浏览器的所有页面：

LT script type="text/javascript" src="../ie5.js" GT LT /script GT
LT script type="text/javascript" src="../common_functions.js" GT LT /script GT
LT /head GT
LT body GT

适用于“边缘”和其他浏览器的所有页面：

LT /head GT
LT body GT   
LT script type="text/javascript" src="../ie5.js" GT LT /script GT
LT script type="text/javascript" src="../common_functions.js" GT LT /script GT

为什么？只有微软会知道。

于 2016-03-24T12:00:45.357 回答