Question

无法弄清楚为什么在以下聚合物中我无法调用keypressHandler函数。我究竟做错了什么？（我尝试将on-keypress属性放在span元素本身上，但仍然没有雪茄。）其余功能按预期工作。

<link rel="import" href="../bower_components/polymer/polymer.html">

<polymer-element name="psq-posscell" attributes="isposs nVal"  on-tap="{{toggle}}" on-keypress="{{keypressHandler}}" >
  <template>
    <link rel="stylesheet" href="../bower_components/polymer-flex-layout/polymer-flex-layout.css" />
    <link rel="stylesheet" href="psq.css" />
    <span class="flexbox align-center justify-center toggle" >{{isposs ? nVal : ' '}}</span>
    <style>
        .toggle {
            float:left; 
            border:1px solid white;
            text-align:center;  
            line-height:2;
            background-color:#f2f2f2;      
        }

        .toggle:hover {
            background-color:#0d2f5a;
            color:white; 
          }

    </style>

  </template>
  <script>
    Polymer('psq-posscell', {
      isposs: true,
      toggle: function() {
        this.isposs = !this.isposs;
        console.log("toggle called");
      },
      ispossChanged: function() {
        console.log("ispossChanged called");
      },
      keypressHandler: function(event, detail, sender) { 
        console.log("key pressed");
      },
    });
  </script>
</polymer-element>

Answer 1

当您按某个键时，系统必须知道该事件的发送位置。这就是focus概念的原因。要使您的元素接收密钥，必须将其集中。

您可以通过设置tabIndex（例如

）使其具有焦点

ready: function() { this.tabIndex = 0; }

现在，您可以通过调用元素focus()）上的this.focus()方法，或通过标记或点击它来使您的元素集中。

一旦你的元素被聚焦，它就会收到按键。

未调用Polymer按键事件处理程序

1 个答案: