如何在Polymer 1.0中监听元素的事件？

Question

我想在不制作自定义元素或模板的情况下使用Polymer的UI元素(例如,铁图标,纸张按钮等).

例如,假设我有:

<paper-button id="my-button">Click me</paper-button>

我该如何收听"点击"事件？只需添加一个事件监听器来"点击"ID"我的按钮"就不起作用了.

Answer 1

它应该工作吗？我假设你想在主文档(index.html)中使用Polymer UI元素,而不必创建任何自定义组件.说你有

<paper-button id="btn">Click me</paper-button>

在index.html中.通过vanilla js,

document.querySelector("#btn").addEventListener("click", function (e) {...});

并通过jQuery,

$("#btn").on("click", function (e, u) {...});

p/s:我会写一个快速的jsbin作为演示,但是rawgit似乎有问题,而且我不知道托管Polymer Elements的替代CDN.

让我明确一点:聚合物元素和扩展的Web组件被设计为与框架无关,如果编码正确,它们将自行工作 - 就像任何其他HTML元素一样.请不要为了dom绑定而进行dom-bind.你只有这样做才能a)在你的用例中要求Polymer的糖(如数据绑定); 和b)你想使用聚合物的糖index.html- 如果你不这样做,请不要为你的应用添加额外的复杂性.

我找到了一个cdn服务聚合物元素,所以:

看,没有dom-bind和元素正在使用vanilla js.

看,没有dom-bind和元素正在使用jQuery.