是否有可能將事件動態添加到元素

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); 
      }); 
     }