Polymerjs iron-a11y-keys元素 _Polymerjs元素

< iron-a11y-keys> 元素用于使用跨浏览器界面处理键盘命令。
keys属性指示事件将以哪种键组合触发。它接受修饰键, 例如Shift, Control, Alt, Meta和一些常见的键盘键, 例如az, 0-9, F1-F12, Page Up, Page Down, 左箭头, 右箭头, Home, End, Escape, Space, Tab, 然后按Enter。
所有键都应缩短并且应小写。例如, 向右箭头表示向右, ” Page Up” 用于向上翻页, ” Control” 用于Ctrl, Escape表示esc, F5表示f5, 依此类推。
让我们以一个示例来演示Iron A11y Keys的用法：
【Polymerjs iron-a11y-keys元素】打开命令提示符, 然后使用以下代码导航到项目文件夹以使用iron-a11y-keys元素。

bower install PolymerElements/iron-a11y-keys --save

这会将iron-a11y-keys元素安装在bower_components文件夹中。接下来, 使用以下命令将iron-a11y-keys文件导入index.html中。

< link rel = "import" href = "http://www.srcmini.com/bower_components/iron-a11y-keys/iron-a11y-keys.html">

例：

< !DOCTYPE html> < html> < head> < base href = "http://polygit.org/components/"> < meta name = "viewport" content = "width = device-width"> < title> iron-a11y-keys< /title> < link rel = "import" href = "http://www.srcmini.com/polymer/polymer.html"> < link rel = "import" href = "http://www.srcmini.com/iron-a11y-keys/iron-a11y-keys.html"> < link rel = "import" href = "http://www.srcmini.com/paper-input/paper-input.html"> < /head> < body> < demo-keys> < /demo-keys> < dom-module id = "demo-keys"> < template> < iron-a11y-keys target = "[[_target]]"keys = "shift+enter enter esc pageup pagedown up down left right space" on-keys-pressed = "_onKeyPress"> < /iron-a11y-keys> < h4> Press any of the below keys and check console.< /h4> < p> shift + enter, enter, esc, pageup, pagedown, up, down, left, right, space.< /p> < paper-input type = "text" value = "http://www.srcmini.com/{{_value::input}}" id = "input" /> < /template> < script> Polymer ({is: 'demo-keys', properties: {_value: {type: String}, _target: {value: function() {return this.$.input; }}}, _onKeyPress: function(e) {e.detail.keyboardEvent.preventDefault(); console.log(e.detail.combo); }}); < /script> < /dom-module> < /body> < /html>