为什么不执行脚本标记?

时间:2013-04-15 09:41:51

标签: meteor

我试图在Meteor app for collaborative sketching中添加Google Plus One按钮,我注意到模板中的script标签未执行。

<template name="gplus">
    <!-- Place this tag where you want the +1 button to render. -->
    <div class="g-plusone" data-href="{{url}}"></div>

    <!-- Place this tag after the last +1 button tag. -->
    <script type="text/javascript">
        console.log("Google Plus button");
        (function() {
            var po = document.createElement('script');
            po.type = 'text/javascript';
            po.async = true;
            po.src = 'https://apis.google.com/js/plusone.js';
            var s = document.getElementsByTagName('script')[0];
            s.parentNode.insertBefore(po, s);
        })();
    </script>
</template>

我通过将脚本移动到单独的JavaScript文件来获得工作按钮,但我仍然想知道为什么内联脚本不起作用。

我在控制台上看到了脚本标记,但脚本本身并没有运行。 Meteor如何做到这一点?

2 个答案:

答案 0 :(得分:4)

Meteor只是将gplus模板的内容插入到DOM中,所以当然没有任何事情发生,因为当元素添加到DOM时没有脚本执行。

要解决此问题,您可以创建一个.js文件并将其放在客户端文件夹中,Meteor将自动为您包含并执行(以及缩小生产时间)。

答案 1 :(得分:2)

以下是我在应用中加载Google +1按钮的操作:

1。在应用程序的<head>标记之间添加JS库。

<head>
  <!-- Load JS Library -->
  <script src="https://apis.google.com/js/platform.js" async="async" defer="defer"></script>
</head>

2。插入+1按钮。

<template name="myTemplate">
  <div data-href="https://hackisition.com/" data-size="medium" class="g-plusone"></div>
</template>

3。渲染按钮。

Template.myTemplate.rendered = function() {
  return gapi.plusone.go();
};