如果選中，則從紙張復選框獲取價值

Question

有人問過類似的問題 ，我正在嘗試使用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>

因此，基本上我想在選中該復選框時顯示其名稱。 如果我決定為他們的年齡添加另一個復選框，它也會這樣做。 但是，上面的代碼在選中或未選中時兩次運行該代碼，甚至運行三次。 如何使它在選中時執行一次而在未選中時不執行？

Answer 1

每次有人點擊復選框時，都會在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);
    }
}