繁体   English   中英

如果选中,则从纸张复选框获取价值

[英]Get value from paper-checkbox if checked

有人问过类似的问题 ,我正在尝试使用Polymer 1.1中的paper-checkbox做同样的事情

这是我的完整设置:

<dom-module id="my-app">
 <template>
  <firebase-collection
   location="htt://www.abc.com/users"
   order-by-child="formatOrder"
   data="{{users}}">
  </firebase-collection>
  <template is="dom-repeat" items="[[users]]" as="user">
   <paper-checkbox id="user-checked" value="{{user.name}}" on-tap="userRequest">click</paper-checkbox>
  </template>
 </template>
 <script>
  Polymer({
   is: "my-app",

   userRequest: function() {
    var cbs = document.querySelectorAll('#user-checked');
    for(var i = 0; i < cbs.length; i++) {
     cbs[i].addEventListener('change', function() {
      if(this.checked) {
       console.log(this.value);
      }
     });
    }
   },
  });
 </script>
</dom-module>

因此,基本上我想在选中该复选框时显示其名称。 如果我决定为他们的年龄添加另一个复选框,它也会这样做。 但是,上面的代码在选中或未选中时两次运行该代码,甚至运行三次。 如何使它在选中时执行一次而在未选中时不执行?

每次有人点击复选框时,都会在userRequest函数中为change事件添加一个事件侦听器。 因此,用户点击复选框的次数越多,针对同一事件的事件侦听器就会越多。 每当事件触发时,他们都会被呼叫。 但是实际上您只需要一个即可直接添加标记。

<paper-checkbox on-change="checkboxChanged">click</paper-checkbox>

然后,在事件处理程序中,您可以通过event.target.value访问复选框值

checkboxChanged : function(event){
    if(event.target.checked) {
        console.log(event.target.value);
    }
}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM