Javascript 聚合物不'；不允许在Chrome中设置内部元素的样式和传播事件

这几周我开始使用聚合物。我正在尝试创建一个

纸张提交

元素，其中包括一个按钮和一个

纸张按钮

，一旦按下该按钮，就会触发隐藏按钮的单击事件

这在Firefox中运行良好：

paper按钮

的样式正确（使用一个类），单击事件触发按钮的单击事件，包含的表单触发提交事件

但在Chrome上，纸张按钮忽略了我设置的样式（参见示例：无背景颜色更改），并且似乎停止传播按钮的单击事件。结果是一个不带样式的纸张按钮，不会触发任何内容。

这是来源：

CSS样式，在主页中链接：

paper-button.blue {
  color: #FFFFFF;
  background-color: #2196F3; }

论文提交聚合物元素：

<link href="../polymer/polymer.html" rel="import">
<link href="../paper-button/paper-button.html" rel="import">

<polymer-element name="paper-submit" attributes="bClass raised recenteringTouch fill" role="button">
  <template>
    <style>
      #submit-button {
        display: none;
      }
    </style>
    <paper-button id="button" class="{{bClass}}" raised="{{raised}}" recenteringTouch="{{recenteringTouch}}" role="button">
      <content></content>
    </paper-button>

    <button type="submit" id="submit-button"></button>
  </template>
  <script>
    Polymer({
      publish: {
        bClass: '',
        raised: false,
        recenteringTouch: false,
        fill: true
      },

      ready: function () {
        var submit = this.$['submit-button'];
        var button = this.$.button;
        button.addEventListener('click', function (ev) {
          submit.click();
        });
      }
    });
  </script>
</polymer-element>

该元素位于一个带有一些必填字段的表单中：在Firefox上，它们会触发错误，在Chrome上，什么都不会发生

---

您能帮助我吗？

还有另一种方法：

---

就css而言，如果你在阴影边界之外，你需要刺穿它们来覆盖它们

body /deep/ paper-button {
  ...
}

这是一支有密码的钢笔

不知道为什么不管你在评论中说了什么，在这种情况下你必须使用新元素。您应该能够以任何方式进行样式设置和表单提交。我可能只是没有你的项目的背景，所以我道歉，如果我在这方面不正确

要获得一些使用“纸质表格”的灵感，请查看
你好，Goce，谢谢你的建议。尽管如此，即使它清除了我的代码，这也不能帮助我解决主要问题。纸质按钮不会触发“单击”事件，因此您无法为其添加侦听器。检查文档并查看演示源代码：Hello Goce。这就是我创建自定义元素的原因：它包含一个隐藏的submit按钮，该按钮将触发外部表单的submit事件。如问题中所述，这在Firefox中有效，但在Chrome中无效。此外，样式被忽略（它正确地将参数值绑定到paper button类的1，但是样式被忽略，请参见问题）。谢谢Erik，这解决了我的样式问题。关于提交问题：
按钮被忽略。。。我想避免使用一个使用第三方系统的完整插件（本例中是谷歌的Firebase）来提交表单。。。有道理，不是吗这是我的项目：-正如你所看到的，Chrome不会对按钮的点击事件做出反应。我尝试搜索主机最近的表单并提交它-它工作了-但它将完全绕过HTML5的验证。我找到了一个解决方案，虽然这是一个解决办法，但我觉得它不是一个真正的解决方案：我找到了最近的表单，用
type=“submit”
插入一个
按钮
，单击它，然后我将其从DOM中删除。有关代码，请参阅。
<paper-button id="button" on-click="{{click_submit}}" ...

  click_submit: function () {
    var submit = this.$['submit-button'];
      submit.click();
  }

body /deep/ paper-button {
  ...
}