当前位置: 首页 > 知识库问答 >
问题:

聚合物:我到底应该把元素的Javascript放在哪里?

农均
2023-03-14

以下是在不使用聚合物的情况下运行良好的测试代码:

 <body>
    <style>
    #content {background-color: #f2f2f2;}
    #button {padding: 10px 20px;}
    </style>

    <div id="content">
        <h1 id="title">Title</h1>

        <p>This example uses the addEventListener() method to attach a click event to the document.</p>


        <button id="button">Testbutton</button>
    </div>

    <script>
        function popup2() {
            alert("What's up brow?");
            console.log("deine mudda");
        };

        var button = document.getElementById("button");
        button.addEventListener("click", popup2, false);
    </script>
</script>

</body>

但我希望在聚合物元素中使用Javascript,并尝试了以下插入:

NR 1:脚本标记内的Javascript,模板标记后的Javascript:

 <polymer-element name="my-element">

    <template>
        <style>
        #content {background-color: #f2f2f2;}
        #button {padding: 10px 20px;}
        </style>

        <div id="content">
            <h1 id="title">Title</h1>

            <p>This example uses the addEventListener() method to attach a click event to the document.</p>


            <button id="button">Testbutton</button>
        </div>

    </template>

    <script>
        Polymer('my-element', {
            popup: function() {
                alert('What the... dude?');
            },

            var button = document.getElementById("button");
            button.addEventListener("click", popup, false);

        });
    </script>

</polymer-element>
<polymer-element name="my-element">

    <template>
        <style>
        #content {background-color: #f2f2f2;}
        #button {padding: 10px 20px;}
        </style>

        <div id="content">
            <h1 id="title">Title</h1>

            <p>This example uses the addEventListener() method to attach a click event to the document.</p>


            <button id="button">Testbutton</button>
        </div>

        <script>
            function popup() {
                alert("jajaja");
            };

            var button = document.getElementById("button");
            button.addEventListener("click", popup, false);
        </script>

    </template>

    <script>
        Polymer('my-element', {


        });
    </script>

</polymer-element>

我想这意味着,编译器看不到按钮id,因为它在阴影中?

请指示我。

共有1个答案

寿飞飙
2023-03-14
<polymer-element name="my-element">

  <template>
    <style>
    #content {background-color: #f2f2f2;}
    #button {padding: 10px 20px;}
    </style>

    <div id="content">
        <h1 id="title">Title</h1>

        <p>This example uses the addEventListener() method to attach a click event to the document.</p>


        <button on-tap="{{popup}}">Testbutton</button>
    </div>

  </template>

  <script>
    Polymer('my-element', {
        popup: function() {
            alert('alert');
        }
    });
  </script>

</polymer-element>
<polymer-element name="my-element">

  <template>
    <style>
    #content {background-color: #f2f2f2;}
    #button {padding: 10px 20px;}
    </style>

    <div id="content">
        <h1 id="title">Title</h1>

        <p>This example uses the addEventListener() method to attach a click event to the document.</p>


        <button id="button">Testbutton</button>
    </div>

  </template>

  <script>
    Polymer('my-element', {
        ready: function () {
            var button = this.$.button;
            button.addEventListener("click", function () {
                alert('alert');
            });
        }
    });
  </script>

</polymer-element>
 类似资料:
  • 在Vaadin 10-14中,我应该将静态文件放在哪里,例如CSS、JavaScript和聚合模板?静态文件(如图像)如何? 此外,如何在Vaadin中导入这些文件?Vaadin 14与npm和Vaadin 10-13与bower之间有差异吗?

  • 我试图在某一元素条件下隐藏几个聚合物元素。我知道有几种可能性。在我的opinon中,最简单的方法是引入一个新的CSS类 并将其添加到聚合物元素的类列表中 但这对元素没有影响。元素仍然可见。对elment检查器的查看显示,添加了该类: 其中parent-elem是父元素的名称。 谁能解释一下为什么元素不会被隐藏? 谢谢。 问候你,梅森曼

  • 我目前正在使用jdk-9 149测试将Java 8应用程序迁移到Java 9/Jigsaw。 该项目采用标准的Maven目录布局,即具有,,等等。 只要我添加到,maven编译器插件无法抛出NullPointerException。这是因为它也希望找到目录的模块信息。因此,据我所知,有以下几种选择: 将测试类保留在单独的模块中,这意味着它们只能访问主模块的导出包 显然,这两个选项似乎都不可取,所以

  • 我搜索了很多,几乎所有我发现的例子都使用了控制器中的异常处理和自己的异常处理程序。我一直认为这应该在程序的服务层上完成。如果不是,我真的不明白为什么要创建单独的服务层。 另外,如果我在Controller中实现异常处理,是否意味着我必须在前面的所有层中抛出异常?

  • 我有一个自动化项目使用Selenium,它将调用ChromeWebDriver并运行testcase 但Chromedriver不能在聚合物框架构建的网站上显示元素, 我们可以通过检查F12查看元素。但chromedriver找不到元素。 这里是网站的urlhttps://shop.polymer-project.org/我们不能使用ChomeDriver来查找元素内部节点“影子根”。此处代码:

  • 问题内容: 是否存在有关嵌套HTML 和HTML元素的最佳实践? 经典方式: 要么 问题答案: 从w3开始:标签本身可以位于相关控件之前,之后或周围。 要么 要么 请注意,当表格用于布局时,不能使用第三种技术,标签位于一个单元格中,而其关联的表单字段位于另一个单元格中。 任一有效。我喜欢使用第一个或第二个示例,因为它可以为您提供更多的样式控制。