8

我可能要求太多，但我试图让 jQuery 模板与在 ie8 中工作的 html5 元素。我正在使用 head.js 以便注册 html5 元素，我也尝试了 html5shiv 但没有运气。页面中还有其他 html5 元素可以正常工作，但是如果我在模板中使用 html5 元素，jquery 模板系统不会返回任何内容。

这是我的一个模板的示例：

<aside>
    <script id="sidebar-template" type="text/x-jquery-tmpl">
        <section>
            <header>${name}</header>
            <section>
                {{each links}}
                <a href="${link}" class="${icon}">${name}</a>
                {{/each}}
            </section>
        </section>
    </script>
</aside>

如果我将 html5 元素更改为 div 并填充模板在 ie8 中工作。我应该注意到这个模板适用于所有其他浏览器，这并不奇怪......

我整理了一个 jsfiddle 来展示我的模板：http: //jsfiddle.net/keegan3d/E6EbG/1/

有没有办法让这些 html5 元素在 ie8 中工作？

4

5 回答 5

2

嘿，这可能有点晚了，但是我在对我的应用程序进行 ie8 测试时遇到了这个问题。我正在做类似的模板工作，而 ie8 在注入 html 时没有对其进行样式设置。

查看http://jdbartlett.com/innershiv/

干杯

于 2011-08-26T02:06:16.543 回答
2

我自己也遇到了这个问题。当使用模板函数返回的 jQuery 对象作为 .html 的输入时，在带有 html 5 元素的 IE8 中会出现问题。例如：

$("#my_container").html($.tmpl("myTemplate", { items: items }));

在尝试了一些事情后，我发现了以下解决方法：

var htmlContent = $.tmpl("myTemplate", { items: items }).html();
//assuming we have one outer element, which is a div
htmlContent = "<div>" + htmlContent + "</div>";
$("#my_container").html(htmlContent);

我怀疑这是一个 jQuery 错误，与模板引擎没有特别的关系。

于 2011-03-18T10:13:39.303 回答
1

也许与您的具体问题无关，该线程似乎是相关的谷歌搜索结果，所以它可能有助于其他也通过谷歌访问的人。

...

我遇到了同样的问题 - 我有一个 HTML 文件（我将其用作所有模板的集合，保存 HTTP 请求），其中包含各种脚本块中的所有模板。

为了从这个批量文件中提取单个 HTML 块，我使用了 .text() 和 .contents() - 而 IE8 无法处理。

事实证明，获取内容的唯一可靠方法是使用 .html() - 例如：

<script class="template-header" type="text/x-jQuery-tmpl">
    <div id="container-title" class="container">
        <div class="container-inner">
            <div class="box-headline app-nav">
                <div class="box-inner">
                    <h1><a href="${prefs.urlShopHome}" class="app-nav">${text.name}</a></h1>    
                </div>
            </div>
        </div>
    </div>
</script>

这是jQuery部分：

// ...
"success": function( data, textStatus, jqXHR ) {
    var header = $(data).filter(function(){ return $(this).is('.template-header') });
    header.each(function() {
        var html = $(this).html(); // do not use .text(), .contents() here
        // ...
    });
});

感谢 Ben Nadel - 他做了测试： http ://www.bennadel.com/blog/1829-Script-Tags-jQuery-And-Html-Text-And-Contents-.htm

于 2011-04-04T12:04:35.117 回答
0

虽然不是真正的答案，但我可以确认我遇到了类似的问题。在某些情况下，内容拒绝呈现，在其他情况下，针对 html5 元素的样式拒绝应用。将新的 html5 元素更改为 div 使一切都按我的预期工作。

于 2011-03-04T15:16:46.600 回答
-1

对于 IE8，您需要使用 HTML5 shiv。

我插入了你的 Javascript：

document.createElement("aside");
document.createElement("section");
document.createElement("header");

此处的结果： 更新的 jsFiddle

于 2011-04-23T21:15:54.047 回答