jquery 添加新的复选框，当点击新的复选框时，它什么也没发生

Question

我有三张桌子。 它们都包含一些复选框。 当第一个表中的复选框被选中时，它会在第二个表中添加一些新的复选框。 但是当我选中第二个表中的复选框时，它什么也没发生。 似乎复选框事件只观察第一个表中的复选框。 以下是我的js代码片段。

function bindEvent4CheckboxArea() {
  $('input[type=checkbox]').change(function() {
    initController.initGlobalData(false);
    $('input[type=checkbox]').each(function() {
      if ($(this).is(':checked')) {
        if ($(this).attr('id').indexOf('trade') >= 0) {
          var tradeId = $(this).attr('id');
          var tradeIdByInt = tradeId.substring(6);
          globalVar.userSelectedTrade.push(tradeId);
          if (tradeIdByInt < 100) {
            globalVar.userSelectedFirstTrade.push(tradeIdByInt);
          } else if (tradeIdByInt < 10000) {
            globalVar.userSelectedSecondTrade.push(tradeIdByInt);
          }

        } else {
          globalVar.userSelectedIndex.push($(this).attr('id'));
        }
      }
    });
    //add new checkbox into the second table
    render.drawTradeInfoArea('#second_trade');
    // add new checkbox into the third table
    render.drawTradeInfoArea('#third_trade');

  });
}

Answer 1

如果它有效，请尝试下面的代码。 由于某些复选框是动态生成的，因此您必须使用 jQuery .on 。 如果您将我的代码与您的代码进行比较，那么您会发现我更改了第二行代码。

function bindEvent4CheckboxArea() {
      $( "body" ).on( "change", "input[type=checkbox]", function() {
        initController.initGlobalData(false);
        $('input[type=checkbox]').each(function() {
          if ($(this).is(':checked')) {
            if ($(this).attr('id').indexOf('trade') >= 0) {
              var tradeId = $(this).attr('id');
              var tradeIdByInt = tradeId.substring(6);
              globalVar.userSelectedTrade.push(tradeId);
              if (tradeIdByInt < 100) {
                globalVar.userSelectedFirstTrade.push(tradeIdByInt);
              } else if (tradeIdByInt < 10000) {
                globalVar.userSelectedSecondTrade.push(tradeIdByInt);
              }

            } else {
              globalVar.userSelectedIndex.push($(this).attr('id'));
            }
          }
        });
        //add new checkbox into the second table
        render.drawTradeInfoArea('#second_trade');
        // add new checkbox into the third table
        render.drawTradeInfoArea('#third_trade');

      });

}

请尝试让我知道它是否有效。