jQuery.append、类型输入和 Windows 应用商店应用程序 (HTML/CSS/JS)

Question

我有一个 Window Store 应用程序，我想在其中动态添加一些标记，我的问题可以归结为:

工作中

$('.some-element').append('<input type="radio"><label>Test</label>');

不工作

$('.some-element').append('<input type="radio" name="test"><label>Test</label>);

Visual Studio 告诉我:

JavaScript runtime error: Unable to add dynamic content. 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.

并指向 jQuery 追加实现中的一行:

append: function() {
        return this.domManip(arguments, true, function( elem ) {
            if ( this.nodeType === 1 || this.nodeType === 11 ) {
                this.appendChild( elem ); // Here!
            }
        });
    }

有谁知道有没有办法解决这个问题？ (我需要 jQuery，因为我想使用 JsRender 作为我的模板引擎)。

Answer 1

您正在使用主机强制安全功能。当您从字符串创建元素时，Win8 HTML 主机不喜欢它；在这种情况下，特别是当您将 name=""属性放在输入元素上时，它不喜欢它。您可以设置 id 而不是名称吗？

参见http://msdn.microsoft.com/en-us/library/windows/apps/hh465388.aspx了解什么是安全的详细信息。

错误消息实际上为您提供了两个解决该错误的选项:

1. 使用toStaticHTML方法过滤动态内容
2. 显式创建元素和属性

使用 toStaticHTML 看起来像这样:

    $('.some-element').append(toStaticHTML('<input type="radio" name="test"><label>Test</label>'));

但这将导致创建的 HTML 看起来可能与您传入的字符串不同； toStaticHTML 将删除被认为不安全的元素和属性。

第二种选择是直接使用 DOM API 而不是 jQuery 来创建相关元素，您已经说过这是不行的。

还有第三个选项，尽管它可能无法让您完成商店验证过程:

MSApp.execUnsafeLocalFunction(function() {
    $('.some-element').append('<input type="radio" name="test"><label>Test</label>');
});

这将暂时禁用不安全的 html 检查。 除非您已完成安全分析，否则请勿执行此操作。特别是，不要获取从 XHR 获得的字符串并使用它来创建 DOM，这是获取您的应用程序和用户的计算机 pwnd 的邀请。