Javascript insertAdjacentHTML 带有 onclick 事件的标签

Question

当一个复选框被选中时，我插入一个新的标签来显示选中的内容。 我向该标签添加了一个 onclick 事件，但是当我出于某种原因点击它时，它给了我一个错误，即找不到该函数。

 const removeItem = (e) => { e.preventDefault(); e.target.remove(); } document.querySelectorAll('.choose').forEach(choose => { choose.addEventListener('change', (e) => { if (e.target.checked) { document.getElementById('selected').insertAdjacentHTML( "beforeend", `<a id="chosen-${e.target.id}" href="" onclick="removeItem()">${e.target.value}<i class="icon-close"></i></a>` ); } else { console.log('remove') } // document.getElementById('selected').querySelect('selectedItem').remove(); }) })

 <label> <input value="Value 1" id="1" class="choose" type="checkbox" data-np-invisible="1" data-np-checked="0" /> Add Value 1 </label> <div id="selected"></div>

Answer 1

我在代码片段中对其进行了测试，看起来e是未定义的。 您需要在此处将event传递给removeItem函数：

`<a id="chosen-${e.target.id}" href="" onclick="removeItem(event)">${e.target.value}<i class="icon-close"></i></a>`