2013-08-02 45 views
0

這適用於Chrome瀏覽器,但它在IE瀏覽器中生效。x-tags不會觸發IE上的WebComponentsReady

我試圖使用HTMLImports(通過x-tag庫)導入標籤,但WebComponentsReady事件永遠不會觸發,並且我看到我的元素以HTMLUnknownElements的形式出現。

<element name="test-tag"> 

    <template> 
    <section> 
     I am an instance of test-tag 
    </section> 
    </template> 


    <script> 
    if (this != window) { 

     var element = this; 
     console.log("element", element); 


     xtag.register(this, { 

     lifecycle: { 
      created: function() { 
      console.log("created." + "created()", arguments); 

      var template = element.querySelector("template"); 
      console.log('template', template, template.content); 

      this.appendChild(template.content); 

      } 
     } 
     }); 
    } 
    </script> 
</element> 

而且我在控制檯收到此...

窗口中加載
HTMLImportsLoaded
元素[對象HTMLUnknownElement]
模板[對象HTMLUnknownElement]未定義
SCRIPT5022:HierarchyRequestError
014_xtag,第17行字符13

<!doctype html> 
<html lang="en-US"> 
<head> 
    <meta charset="UTF-8"> 
    <title>X-Tag</title> 

    <script type="text/javascript" src="../../lib/x-tag-core.js"></script> 
    <link rel="import" href="components/test-tag.html"/> 
    <script type="text/javascript"> 

    window.onload = function() { 
     console.log("window loaded"); 
    }; 
    window.addEventListener('HTMLImportsLoaded', function() { 
     console.log("HTMLImportsLoaded"); 
    }); 
    window.addEventListener('WebComponentsReady', function() { 
     console.log("WebComponentsReady"); 
    }); 
    </script> 
</head> 

<body> 
<test-tag></test-tag> 
</body> 
</html> 

HTMLImports只是普通的失敗。不知道爲什麼,但如果我在主html文件中定義自定義元素,它的工作原理就好了。

我也在Safari中測試。模板標籤顯示爲空。

因此...導入時模板標籤失敗,但實際導入本身正在工作。

回答

1

Jeeeeez。我在我的元素的腳本標記中添加了type =「text/javascript」,現在一切正常。

+0

是的,所有其他瀏覽器不會推斷缺少類型屬性爲JavaScript - 自然IE幻想本身就是一個特殊的雪花。 – csuwldcat