Javascript 为什么'；在我的页面加载了一个keyup事件之后，这个输入是否与jquery一起添加？

因此，我正在创建的页面有一个按钮，可以根据需要添加输入字段。看起来像

文件
+

然后有一些jquery命令按钮添加一个新的输入字段，并让输入字段中的任何值反映在

preview

div中

$(document).ready(function () {

    $("#add-name").click(function () {
        $(this).before("<input type='text' placeholder='Name'>");
    });

    $("input").keyup(function () {
        $("#preview").html($(this).val());
    });

}

$（文档）.ready（函数（）{
$（“#添加名称”）。单击（函数（）{
$（本）。在（“”）之前；
});
$（“输入”）.keyup（函数（）{
$（“#预览”）.html（$（this.val（））；
});
}

当我通过按钮添加另一个输入时，当我输入时，该输入不会触发keyup事件。这是为什么，我能做些什么？谢谢

此外，这是我为这个问题编写的一个过于简单的示例。我知道这看起来不太漂亮，但它很简单，可以帮助我理解发生了什么。

事件处理程序仅绑定到当前选定的元素。

要将事件附加到以后添加到文档中的元素，请尝试使用以下方法执行委派事件处理程序：

$（文档）.ready（函数（）{
$（“#添加名称”）。单击（函数（）{
$（本）。在（“”）之前；
});
$（“body”）。在（“键控”、“输入”和“函数”）上{
$（“#预览”）.html（$（this.val（））；
});
})；

+

$("body").on("keyup", "input",function () {