javascript - 以编程方式在 javascript 和 onclick 事件中添加单选项目

Question

我有一个单选按钮，我正在以编程方式向其添加元素。正如你所看到的，我在 html 代码中设置了 onclick 事件，但当我推送项目时它没有被触发。

<div class="btn-group" data-toggle="buttons" name="radio" id="selection">
</div>

<script type="text/javascript">
   var selection = document.getElementById("selection");
   selection.style.visibility = 'visible';
   var selectionToAdd='';
   var toAdd=[];
   for(var indexSelectionArticles = 0 in query) {
       for(var indexSelectionEntities = 0 in query[indexSelectionArticles].entities) {
            if(query[indexSelectionArticles].entities[indexSelectionEntities].category){
                if($.inArray(query[indexSelectionArticles].entities[indexSelectionEntities].category, toAdd) == -1) {
                    selectionToAdd=selectionToAdd + '<label class="btn btn-default"><input type="radio" onclick="javascript:console.log(whatever);" name="options" id="option'+query[indexSelectionArticles].entities[indexSelectionEntities].category+'">&nbsp; <i class="fa fa-'+query[indexSelectionArticles].entities[indexSelectionEntities].category+'"></i>&nbsp; '+capitalizeFirstLetter(query[indexSelectionArticles].entities[indexSelectionEntities].category)+' &nbsp;</input></label>';
                    toAdd.push(query[indexSelectionArticles].entities[indexSelectionEntities].category);
               }
           }
       }
   }
   selection.innerHTML = selectionToAdd;
</script>

该项目已正确添加，但未触发 onclick。我也尝试过使用一个函数，但结果是相同的。我还尝试了如下监听器，该监听器适用于页面中的其他 radio ，但不适用于此 radio :

$('input[type="radio"]').on('click change', function(e) {

    if(e.target.id == 'option1') {
      option = 'option1';
    }
    else if(e.target.id == 'option2') {
      option = 'option2';
    }
    else if(e.target.id == 'option3') {
      option = 'option3';
    }
    else if(e.target.id == 'option4') {
      option = 'option4';
    }
    else if(e.target.id == 'option5') {
      visualizationType = 'articles';
    }
    else if(e.target.id == 'option6') {
      visualizationType = 'entities';
    }
    else {
      console.log(e.target.id);
    }
});

哪里出错了？

谢谢

Answer 1

您正在包装 <input>在 <label> 。 onclick 事件不需要在 <label> 上吗？而不是<input> ？