Javascript 使用jquery选择div不工作

我在动态创建的元素上有一个事件侦听器：

<script>
        $(document).on('change', '.inputfile', function() {
            var name = ($(this).val().split('\\').pop());
            selectFile(name);
        });
</script>

$（document）.on（'change'，'.inputfile'，function（）{
var name=（$（this.val（）.split（'\\'）.pop（））；
选择文件（名称）；
});

一旦选择文件，我想附加一段显示文件名本身。我的问题是jquery选择器不工作：

function selectFile(filename) {
        alert(filename);
        var classes = $(this).closest('.inputgroup');
        $('classes').append('<p>'+filename+'</p>');
}

函数选择文件（文件名）{
警报（文件名）；
var classes=$（this）.closest（'.inputgroup'）；
$（'classes'）。追加（'p>'+filename+'
'）；
}

我想用class=inputgroup将段落附加到最近的div中，因为该类有几个div。 使用简单的

$（'.inputgroup'）.append（''+filename+'
'）正常，并创建段落。
这是HTML：

<div class="inputgroup">
   <label class="btn btn-default btn-info" style="margin-top: 8px">
         Browse <input type="file" style="display: none;" class="inputfile"/>
   </label>
   <button type="button" class="btn btn-outline-danger" onclick="myAjax()">Ok</button>
   <span id="remove_field" class="glyphicon glyphicon-remove" aria-hidden="true" style="vertical-align: middle"></span>
</div>


浏览
好啊
这一行

$('classes').append('<p>'+filename+'</p>');

这条线

$('classes').append('<p>'+filename+'</p>');

在这行代码中

var classes=$（this）.closest（'.inputgroup'）；
$（'classes'）。追加（'p>'+filename+'
'）

第一行提供了一个jQuery对象。您可以直接使用它附加
p
标记

正如在其他答案中已经提到的，您的第二行查找名为
classes
的元素，该元素不存在

因此，只需使用您拥有的Jquery对象并附加段落即可。如下

classes.append（“”+filename+”
）
在这行代码中

var classes=$（this）.closest（'.inputgroup'）；
$（'classes'）。追加（'p>'+filename+'
'）

第一行提供了一个jQuery对象。您可以直接使用它附加
p
标记

正如在其他答案中已经提到的，您的第二行查找名为
classes
的元素，该元素不存在

因此，只需使用您拥有的Jquery对象并附加段落即可。如下

classes.append（“”+filename+”
）
我相信，
$（this）.nextest（'.inputgroup'）
超出范围，不应该工作，$（'this）此时是文档。@DIEGOCARRASCAL即使我将其放在事件处理程序（HTML文件内）中，也没有效果jQuery
$（this）
是生成事件的实例DOM元素，但它仅在事件运行的函数中指向此元素。。。因此，
$（document）.on（'change'，'.inputfile'，function（）{…}
是您希望
$（this）的作用域。最近（'.inputgroup'）；
因为在它
$（this）
中，
是具有
id=“.inputfile”
的元素。我相信
$（this）。最近（'.inputgroup'）；
超出了作用域，不应该工作，$（'this）此时是文档。@DIEGOCARRASCAL即使我将其放入事件处理程序（HTML文件内），也没有效果jQuery
$（this）
是生成事件的实例DOM元素，但它仅在事件运行的函数内指向此元素…因此
$（文档）。on（'change'、'.inputfile'，function（）{…}
是您想要为
$（this）.closest（'.inputgroup'）；
，因为其中
$（this）
是具有
id=“.inputfile”
的元素。
$(document).on('change', '.inputfile', function() {
    var name = ($(this).val().split('\\').pop());
    $(this).closest('.inputgroup').append('<p>'+name+'</p>');
});