使用 jquery 从文件上传中获取文件名并将文件名设置为文本字段

Roh*_*hin 1 html javascript jquery jsp file

我必须获取上传文件的文件名并将其设置到文本字段

我做了如下

<input type="file" name = "filename" id="upload">
<input type="text" name = "file" id="file">
Run Code Online (Sandbox Code Playgroud)

//jquery

$('#upload').change(function() {
    var filename = $('input[type=file]').val().split('\\').pop();
    var lastIndex = filename.lastIndexOf("\\");
    $('#file').val(filename);
});
Run Code Online (Sandbox Code Playgroud)

也尝试过这个

$('#upload').change(function() {
    var filename = $(this).val();
    var lastIndex = filename.lastIndexOf("\\");
    if (lastIndex >= 0) {
        filename = filename.substring(lastIndex + 1);
    }
    $('#file').val(filename);
});
Run Code Online (Sandbox Code Playgroud)

但文件名不显示在文本字段中。

tka*_*kay 5

您应该在文档中使用jquery。您可能忘记添加这一点。这是工作代码。

      $(document).ready(function() {

    $('#upload').change(function() {
       var filename = $('input[type=file]').val().split('\\').pop();
      console.log(filename,$('#file'));
        var lastIndex = filename.lastIndexOf("\\");   
        $('#file').val(filename);
    });
      });
Run Code Online (Sandbox Code Playgroud)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="file" name = "filename" id="upload">
                                <input type="text" name = "file" id="file">
Run Code Online (Sandbox Code Playgroud)