douye6812 2015-08-03 05:22
浏览 265

如何获取输入文件的文件名并在按钮点击时再次显示它而不上传？

I am having a hard time thinking on what I need to do to achieve my goals.

Goals:
1. To copy the filename of the file I want to upload and display it when I click on a button but NOT upload it.
2. To be able to upload it when the Submit button is clicked.

Steps:

Step 1: I will choose a file to upload. So I will click on Choose File. enter image description here

Step 2: Now it should show the name of the file I've chosen on Step 1. Then, I will click on "Next". enter image description here

Step 3: Clicking "Next" will only display what's in Step 2 but it's grayed-out and instead of a Next button, there is a "Submit" button. It's like a confirmation if I am sure to upload the file. When I click on "Submit", that's the only time the file gets uploaded.
enter image description here

So I need to be able get Step 3. I don't know how though. :'( .
I am using PHP and JS on this.

I am not sure if my question is correct. Feel free to provide corrections as well.

Any help would be very very much appreciated. Thanks so much!!!

  • 写回答

1条回答 默认 最新

  • douguadao3883 2015-08-03 05:34
    关注

    Here is a quick snippet to, hopefully, get you going:

    <body>

    <input type="file" name="upload" id="upload">
    <div id="filename"></div>    

<script type="text/javascript">

    $('#upload').on('change',function(){
       // output raw value of file input
       $('#filename').html($(this).val()); 

        // or, manipulate it further with regex etc.
        var filename = $(this).val();
        // .. do your magic

        $('#filename').html(filename);
    });

    </script>
 </body>

    This will output something like: C:\fakepath\Screenshot_2015-56-03_12-56.JPG in Opera, absolute path to file in IE 11 like C:\users\foo\Desktop\file.jpg

    You can further manipulate value of the file input field to isolate filename only using regex etc.

    评论

报告相同问题？

悬赏问题

  • ¥50 三种调度算法报错 有实例
  • ¥15 关于#python#的问题，请各位专家解答！
  • ¥200 询问：python实现大地主题正反算的程序设计，有偿
  • ¥15 smptlib使用465端口发送邮件失败
  • ¥200 总是报错，能帮助用python实现程序实现高斯正反算吗？有偿
  • ¥15 对于squad数据集的基于bert模型的微调
  • ¥15 为什么我运行这个网络会出现以下报错？CRNN神经网络
  • ¥20 steam下载游戏占用内存
  • ¥15 CST保存项目时失败
  • ¥20 java在应用程序里获取不到扬声器设备