是否有可能将事件动态添加到元素

Question

我有一个EDM模型，我正在尝试为它生成一个动态UI，但它不会将事件添加到多于一个select中。

换句话说，它只适用于1选择，而不是更多。

 function addEvents(id) { 
      $('body').on('click', '#entities_' + id, function(event) { 
      var $e = $(event.target); 
      var entityIndex = $("#entities_" + id + " option:selected").index(); //$e.val(); 
      var entity = entities[entityIndex - 1]; 
      var columns = entity.property; // if index is not -1 


      var $entities_cols = $("#entities_" + id + "_cols").empty(); 
      $.each(columns, function(index, e) { 
       var selectColumnHtmlId = 'selectcolumn_' + e.name; 
       var $selectColumnLabel = $('<label />', { 
       'for': selectColumnHtmlId, 
       text: e.name 
       }); 
       $selectColumnLabel.appendTo($entities_cols); 
       $('<input />', { 
       type: 'checkbox', 
       id: selectColumnHtmlId, 
       value: e.name 
       }).prependTo($selectColumnLabel); 
      }); 

      if (id <= config.expandLimit) 
       addExpand(++id, entity.navigationProperty); 
      }); 
     } 

下面是完整的例子 - https://jsfiddle.net/ntbkyuau/3/

Answer 1

制造它通过改变这项工作，

function addEvents(id) { 
      var $entities = $('#entities_' + id); 
      $('body').on('click', $entities, function(event) { 
      var $e = $(event.target); 
      var entityIndex = $("#entities_" + id + " option:selected").index(); //$e.val(); 
      var entity = entities[entityIndex - 1]; 
      var columns = entity.property; // if index is not -1 


      var $entities_cols = $("#entities_" + id + "_cols").empty(); 
      $.each(columns, function(index, e) { 
       var selectColumnHtmlId = 'selectcolumn_' + e.name; 
       var $selectColumnLabel = $('<label />', { 
       'for': selectColumnHtmlId, 
       text: e.name 
       }); 
       $selectColumnLabel.appendTo($entities_cols); 
       $('<input />', { 
       type: 'checkbox', 
       id: selectColumnHtmlId, 
       value: e.name 
       }).prependTo($selectColumnLabel); 
      }); 

      if (id <= config.expandLimit) 
       addExpand(++id, entity.navigationProperty); 
      }); 
     }