本文旨在解决在使用 Bootstrap 4 的文件上传组件时，动态添加的 input[type="file"] 元素无法显示所选文件名的问题。我们将通过事件委托的方式，确保即使是动态添加的 input 元素也能正确显示文件名。
在使用 Bootstrap 4 的文件上传组件时，我们经常需要动态地添加 input[type="file"] 元素。然而，直接使用 jQuery 的 change() 方法绑定事件，通常只能对页面加载时就存在的元素生效，对于动态添加的元素则无效。 这是因为事件绑定发生在元素创建之前。 为了解决这个问题，我们需要使用事件委托。
事件委托
事件委托的核心思想是将事件监听器绑定到一个静态的父元素上，然后利用
事件冒泡
的机制，当子元素触发事件时，父元素也能监听到。 这样，即使子元素是动态添加的，也能触发父元素上的事件监听器。
实现步骤
选择一个静态父元素：
找到一个在页面加载时就存在的父元素，并且该父元素包含所有动态添加的 input[type="file"] 元素。在本例中，可以选择 id="image_box" 的 div 元素。
使用 on() 方法绑定事件：
使用 jQuery 的 on() 方法，将 change 事件绑定到父元素上，并指定事件触发的目标元素为 input[type="file"]。
获取文件名并更新标签：
在事件处理函数中，获取所选文件的文件名，并更新对应的
