Question

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

代码

default.html 7 default.js

＆＃13;

// 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();
})();

＆＃13;

<!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>

＆＃13;

Answer 1

I went into detail about this in a blog post.

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

您可以使用另一个函数 MSApp.execUnsafeLocalFunction（）来包装您正在使用的函数来注入Javascript。

尝试动态插入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); 
});

You can read more about this issue here.

进一步阅读：

execUnsafeLocalFunction from MSDN

TutsPlus tutorial on jQuery and Win8

Answer 2

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

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

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

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

具有Microsoft边缘的Windows 10应用程序中的内联脚本问题

2 个答案: