与JavaScript生成的HTML交互[复制]

Posted 2021-03-28

这个问题在这里已有答案：

• Event binding on dynamically created elements? 23回答

使用javascript，我从JSON文件中获取数据并将其放入html select元素中。 JSON文件中的每个项目都在select中的不同选项元素中。

我现在想能够在HTML输入元素中显示用户选择的选项。我认为这可以使用此代码：

<script>
$( "select" )
  .change(function() {
    var str = "";
    $( "select option:selected" ).each(function() {
      str += $( this ).text() + " ";
    });
    $( "div" ).text( str );
  })
  .trigger( "change" );
</script>

我认为我的问题是我从javascript生成的HTML无法识别。有没有办法让这项工作成功？

谢谢

答案

是的，如果要动态生成选择，则需要执行事件委派。

更改：

$( "select" ).change(...

至：

$(closestParent).on("change", "select", function()...

“最接近的父”是最接近选择的元素，它不是动态生成的（你甚至可以使用“body”，它会起作用）